This repository documents advanced features not covered in the official Developer documentation from Framer. It's a curated list of function in use in Framer discovered by the Community. These discoveries open the development of more advanced components and overrides. As additional documentation, it doesn't cover the basics and suppose you are already aware of it. If you are not, you can refer to the Further Reading section to learn more about Framer and React developement.
Below is a list of gems discovered by the community that have been discussed in the forum (💬) or documented here (📝).
-
📝 Advanced Property Control
There are more possibilities in terms of property controls than what the official documentation covers. You can:- Use the
ControlType.FontorControlType.ResponsiveImage - Display Icons in the Property Controls
- Get the Property Controls from a Component
- Use the
-
📝 Extract CMS Data
You can export your collections as a JSON file. -
📝 Handshake
Export your Design Component in a Next.js Project. -
📝 useIsOnFramerCanvas
TheuseIsOnFramerCanvashook lets you know where Framer renders the component. -
📝 useFormValue
Read and write data from forms. -
📝 useStore
Share data between two Code Components or Code Overrides across the Website. -
📝 @framerDisableUnlink
Disable the Code Edition of your Component. -
💬 useRouter
Navigate between your website pages. -
💬 Choose your package version
On Framer, you can choose your package version by using esm.sh.
Some helpful guides to learn React × Framer development.
Feel free to contribute to this documentation by sharing or documenting your discoveries. You can add one by submitting a pull request or tag me (@Victorien) in the related discussion from the Framer Forum. Thanks to all Framer members for their contribution ❤️.