Fixed Side Navigation Bar in Framer | Step-by-Step No-code Tutorial

In this video, we'll guide you through the process of how to create a fixed side navigation bar in Framer. Whether you're a beginner or an experienced designer, this step-by-step tutorial will help you add a touch of interactivity to your website.

Chapters:
00:00 Preview
00:23 Creating a List Item Component with Variables
03:35 Editing List Item Component
05:05 Creating the Navigation Bar
06:10 Adding Navigation Bar to Page
07:05 Editing Navigation Bar
07:37 Creating a Component for Navigation Bar
09:05 Adding Component to different pages
10:00 Final

Don't forget to like the video if you find it helpful and subscribe to our channel for more Framer tutorials and design inspiration.

_________________________________________________________

Find me on other channels:

________________________________________________________

_________________________________________________________

If you have any questions or suggestions, please leave them in the comments section below. Let's dive into the world of interactive design with Framer!

[Charlie-lesp]

Thanks Tony, you have helped me a lot. I appreciate the quality of the content you create. You explain things very well, even though I don't speak much English 😂, but you do it in a relaxed and unhurried way...thank you so much 🙏👋👋

[kiarak]

Hey, had a doubt once, I move the side bar to the main frame, the fixed position is disabled for me. what am i doing wrong?

[alexander]

Thanks for the useful information and lesson. But unfortunately, by the end I felt nauseous from the constant super fast camera movement.

[FloNocode]

Hey! Thanks to make this kind of content ! It's very helpful !

We can suggest a type of content for video ?

[DineshKumar-cihm]

Unable to create the Variable and even can't modify the TabName after converting the text to create plain text variable : 2:48 to 4:40