Boostrap Menu

You can use this code as is to add a bootstrap menu to the site, some customizations below:

The tag {#BOOTSTRAPTOPNAV} is replaced with a navbar list items. You don't have to add these, but if you wanted to target them, this is pretty much what is entered for each link.

How to edit

As written above, the navbar switches from the full list to the collapse list with the button at bootstrap's "lg" screen size (992px wide). you can change that to happen at different breakpoints by changing the class "navbar-expand-lg" to "navbar-expand-[sm/md/lg/xl]"

If you want the menu to be in a different spot, and have the button to expand it to be outside, you can, but you have to keep in mind the hiding of the button on larger sizes automatically happens when it's in the nav tag with the "navbar-expand-..." class. If you take it out of that nav tag, it will still work, but you need to add a "d-lg-none" class to make it hide at the same breakpoint as the "navbar-expand-..." class.

To read more about the bootstrap nav menu, see their official documentation.