Flex Navigation Overview
There are a a bunch of cool things you can do with the menus that you can not do with most menus in Rapidweaver.
You can have any part of a menu bar not be a link. All you need to do is make a new page, but not a stacks page. We suggest you use an Offsite Page and leave the URL setting blank. Then put this code in for the Page Title:
You can add labels to drop down menus. Again, use an Offsite page and leave the URL setting blank. Then use this code for the Page Title:
<label>Name of the Label</label>
If you have dividers turned off, but want to add one, you can do this by adding an Offsite Page and leaving the URL blank. Then use this code for the Page Title:
If you want to use Font Awesome icons for menus (with or without words), you can do so very easily. Just find the icon you want to use on http://fontawesome.io/icons/. Then put that code in the Page Title, like this:
<i class="fa fa-home fa-2x hide-for-small"></i>
or if you want to add the name of the page:
<i class="fa fa-home fa-2x hide-for-small"> Home</i>
Be sure to put that space before the name or the page name will be too close to the icon. Also, you will notice we added this little bit of code:
This tells the theme to not show the Icon when the menu is considered small.
Want to make one of your menu items a button, use this code (can be used on any page type):
Using the code this way, will make the button the Primary Color in the Site Styles for the page. If you want to use a different color, use the code like this:
<button class="secondary">Page Name</button>
the class “secondary” will make the button be the secondary color in the Site Styles stack for the page. You can only uses these color settings from the Site Styles stack though:
The other colors from the site styles stack will not work as options.
Remember, if you use these options with Top Bar, you will also want set the Browser Title in the page inspector:
or your browser title will look like this:
Hope these tips and options will help you make your websites the best they can be!
Flex Navigation Video Overiew
Now, go forth and make your websites great!