Learn how to add overrides to your Framer project.
How to add overrides to your Framer project.
Overrides are used to add powerful features to your components within Framer when viewing your website.
Just like Code Components, they're extremely easy to add, and can make a huge difference to the outcome of your project.
It only takes three simple steps to add an override to your Framer project.
Step 1: Copy the Override code.
Navigate to the Override you're looking to add to your project on the FramerFuel library, and copy the override code.
Step 2: Create a new code file.
To do so, navigate to the assets panel within the Framer editor and click the '+' icon where it says code, select 'Override' and give it a name.
Then, paste the code that you just copied from the FramerFuel library.
Step 3: Apply the override.
Applying the override can be done extremely easily, you simply click on the layer that you want to apply the override to, head over to the right-hand panel, press 'Code Overrides' and select your override from the list.
And that's it!
Overrides play a huge part when it comes to adding additional functionality to Framer. They're easy to implement, but unlike components they're only visible when the website is being ran, not within the editor.