Learn how to edit your navigation bar in Webflow by accessing the master component. This tutorial guides you through switching roles, selecting the navigation element, and updating dropdown links.
Chapters
00:00
Introduction to Navigation Editing
Overview of why navigation editing in Webflow requires specific permissions.
00:17
Adjusting User Roles
00:40
Accessing Master Navigation
00:56
Editing Dropdown Menus
01:24
Adding New Pages
02:00
Publishing and Testing
Transcript
Copy
00:01
Changing the navigation in webflow is a little bit tricky.
00:05
Typically when we want to make an edit in webflow we go to the left top corner, switch over to marketer and do everything in a controlled environment.
00:15
For the navigation this is different.
00:17
For the navigation we need to have all the rights.
00:22
So if you are in the marketer role, go to preview role and go back to assign role.
00:30
Click there.
00:32
Then from here if you hover over the navigation bar, you can see it turns green.
00:38
It's also selected here on the left side.
00:40
You don't have that panel.
00:42
It's here under the navigator.
00:45
So you double click on the navigation bar, you see it changes and we are now inside the master navigation.
00:56
From there we hover over one of the drop down toggles.
01:01
In this case I want to edit the product.
01:05
Click on it once, make sure you switch over from style to settings and then click here on show.
01:17
You can see how the drop down looks when it's hovered or clicked.
01:21
You can see we already have a lot of items here.
01:24
In this case I want to add my new page averse events.
01:30
So I click on it once.
01:32
There's like a.
01:33
If you hover over it you can see they all have like their own box.
01:38
Click on it once.
01:39
Link drop down.
01:43
With that selected on the right side, I'm going to choose a page adverse events.
01:54
Now I click outside of the menu and it is already saved.
02:00
From here I can publish on staging to see if it went well.
02:04
And that is how you link pages to the existing navigation.
02:09
If you want to add additional items to the navigation bar, first double click on the nav bar then hover and click for example on companies then go to make sure you switch the settings and show and then from here hover and click on a link drop down and then from here we're going to duplicate an existing item command D or control D on Windows from here you can change your icon click on it once replace image let's see we want to this one change the text FAQ.
03:06
questions small subtitle and then we're gonna link it to a page so link drop down it's now currently linked to the about because we duplicated from the about us and from here we choose a page in this case the FAQ click outside and then it is saved but it will only be live whenever you publish it here on the top corner and that is how you add extra items inside of a drop down.
03:43
And at last we're going to edit the notification banner at the top.
03:47
So first we're gonna go double click on the nav bar, then we're gonna select the banner here and then make sure you have the master banner directly.
04:02
Immediately under the master navigation you need a master banner and then from here either you're gonna double click on the copy and on an add copy here click on the link and then on the right side you can change the text link and also the page where it's linking to.
04:31
Watch.
04:32
If you want to banner completely hidden, then you select the master banner here and you click on hidden.
04:45
If you don't see hidden, make sure you switch from style to settings and then click hidden here and then the banner is hidden, click escape or click outside of the navigation and then it is automatically saved but only published whenever you do it here at the top.