Badger
Documentation
Getting BadgerPro
If you have already a copy of BadgerPro to work with, thank you for the purchase. If you don't, thank you for your interest, you can get BadgerPro by using the button below.
How to use Badger?
In the e-mail with your order, in the Frame+ PDF, find the component's url.
Copy the component's url.
Go to your Framer project.
Select a layer you want to use the component in.
Component should be added to your Assets and show up in the project with the default "Badger badger" badges.
(Optional, but recommended) Go to Assets and update the component. If possible, there will be a clickable "Update" next to the component's name.
Badger takes a simple input consisting of items separated by commas e.g. Home, Blog, Contact. Edit components "Badges" control to show your own badges.
To showcase list of items from a CMS item, add a plain text field to your item's fields and set as a variable in the "Badges" control. Below is an example plain text field called "Pages".
Themes
BadgerPro allows you to set themes for badges. Each theme can have different decorative icon and colours. To apply a theme:
Create a theme in Badger's editor controls. You can use a default name or rename it, hold to the name as it will be needed in the next step.
In your items list, in the "Badges" control or a CMS field, add the theme to an item by separating them with a colon e.g. Home:theme1, Blog:Content, 404:error.
Edit the theme in BadgerPro's editor controls, see the result live in the canvas.