Navigation Menus | Jump Start

We’ve packed in some cool features in working with navigation menus that you may not be aware of that you can utilize when using WordPres’s menu builder at Appearance > Menus.

Icon Integration

Incorporate any of the Font Awesome icons into your navigation by adding the class “menu-icon-{name_of_icon}” — Make sure this is the first class you add to the menu item if you have other CSS classes attached.

Headers and Dividers

Also, you can utilize the classes “nav-header” and “divider” to do some cool things with your WordPress navigation menus. Take the menu over to the right of this page, for example.

This menu was built in WordPress’s menu builder and then inserted into the sidebar with the “Custom Menu” widget. It utilizes not only the icons discussed above, but also header and dividers.

Note: The “divider” class will be omitted when used in the firest level of the “Primary Navigation” location.

No-click Menu Items

This is a real subtle one… Have you ever created a drop down menu on your primary navigation menu, but then realized you don’t have anywhere for the parent menu item to go? — Well, in this case you can simply create a blank menu item and then add the CSS class “no-click”.