single navbar across multiple pages

Bootstrap Studio Help
1

I want a navbar on my site and clicking on different links/tabs in the navbar, I want it to link to different pages eg, from index.html to contact.html, work.html etc. Do I have to recreate my navbar on every page or is there an easy way where I have just one that appears across all pages?

2

If you create your navbar you can then take that Row/Col/Div/ or whatever type of container you have it in and copy it to the next page. When you do this, do a "Paste Linked" from the menu instead of just "Paste". This will create a master component which you can copy to any pages and all will be linked together. When you edit one page it will update all pages at the same time.

I would suggest watching the Tutorial Videos to get the basics of the app. They are a bit outdated for some of the features, but the basic ideas of the features are there for some of the main things and it is a pretty helpful way to get started. Some are videos and some are reading.

2 Likes
3

Thanks Jo, helpful again. Twice in quick succession - you're on fire today!

4

Haha yw!

5

Hello,

It 's very nice to find your answer for this situation!!

But the collapse button does not work right, it did not toggle the menu, just open can not close. This is my page: http://yardsign.bss.design/pagetemplate.html

I copied and "paste link" the navbar from a http://yardsign.bss.design/index_old.html page which is working fine.

Furthermore, I tried to move the navbar menu into a seperate html, then load them into a div by .js file, but the navbar menu did not work. Please help. Thank you very much !

6

When you place it on the new page, make sure you have it set up exactly the same as the other page so that the menu is not being put into an extra container or something like that. That's about the only thing that would stop it from working if it worked on the other page.

  1. That menu on the new page is not the same as the old one at all, many things missing from it. Make sure you copy the entire nav, maybe even copy the entire container item that it's in.
  2. You really need to work out how to add your styles into a CSS file, your code is full of inline styles which are like so 20+ years ago. Everything you add (barring a handful of default settings that get added at times like centering or bold etc.) should be within a new style sheet CSS file.
7

When you've written/completed your NavBar you can save it as a Component.

Ian