Streaming live at 10am (PST)

Hide & Change Nav Bar on different pages


#1

Hello,

In have a nav bar on my site, I dont have it on the home page, on page two I would like it to have different buttons to that on page 3. I try hiding it on page one but then it disappears from all pages. Ive try to copy in on different pages and create different combo classes but it still stays the same on all pages - I know creating different combo classes works on other things but doesnt seem to for nav bar?

Recap:

Page 1 - have no nav bar
Page 2 - Have the nav bar with certain links
Page 3 - Have nav bar with different link than page 2


Here is my site Read-Only: https://preview.webflow.com/preview/propertyhub?utm_source=propertyhub&preview=bdd13056e3174ab452035e843c6d4947


#2

The nav is a symbol = the same design/layout in all pages. In general (Most of the times) from UI aspect - it’s wrong to create different navbars with small tweaks (break Consistency):

For 3 different navbars, you should create 3 different symbols

-Or- solve this by custom CSS code on a specific page (And use one navbar/symbol)

    <style>   
    /*before body of specific page */ 
    a.unwanted-link{
           display: none;
     }
    </style>

#3

This is pretty straightforward, basically for any page you’re not wanting a navbar you can remove it completely by clicking on it and pressing Backspace (or right clicking and going down to Delete).

Because your nav bar is currently a Symbol we’ll need to break it before making changes otherwise it will override all instances around the website. To do that, just duplicate what you have (CTRL+C or right click and go to Copy), paste the copy onto your page (CTRL+V or right click and go to Paste - however keep in mind it will be stacked below your original instance) and then right click the Symbol and go to Unlink. You can now go to the Navigator pane and delete your duplicate nav Symbol, and start editing your new instance of the second nav layout. If you plan on using this around on other pages, just be sure to create a new Symbol and you’re good to go!

If you’re having problems you can follow my quick video recording here. Don’t hesitate to ask if you run into any issues.

Edit: It looks like @Siton_Systems beat me to replying, however his response does cover some of the reasons why you may want to reconsider this type of change. If you end up wanting to continue with the changes you had in mind, feel free to follow what I wrote above :+1:


#4

Thanks very much!! That worked perfectly