Responsive Navigation

The responsive topbar uses Foundation 6 Responsive Navigation Patterns to make it easy to switch between accordion, dropdown and drilldown menus at different breakpoints.

To use this menu type, change the template part in header.php to:

<?php get_template_part( 'parts/nav', 'topbar' ); ?>

Responsive Menu Options

In the functions/menu.php file, locate the joints_top_nav() function. The two important lines of code are:

'menu_class' => 'vertical medium-horizontal menu',
'items_wrap' => '<ul id="%1$s" class="%2$s" data-responsive-menu="accordion medium-dropdown">%3$s</ul>',

Simply update the menu_class and items_wrap to match the navigation pattern you want. You also may need to adjust the class in functions/menu.php depending on the type of menu you are creating.


Want to suggest or contribute changes to these docs? The JointsWP documentation is now hosted on GitHub! View or Edit this page on GitHub.