I'm currently trying to set up a secondary navigation in the Storefront theme by WooCommerce but I'm having trouble to make the mobile version work. I wrote this code so that the navigation is being displayed only on all the /shop subcategories:
add_action( 'storefront_content_top', 'jp_shop_navigation' );
function jp_shop_navigation() {
global $wp;
$current_slug = add_query_arg( array(), $wp->request );
if (strpos($current_slug, 'shop') !== false ) {
?>
<nav id="site-navigation" class="main-navigation" role="navigation">
<button class="menu-toggle" aria-controls="site-navigation" aria-expanded="false"><span><?php echo esc_attr( apply_filters( 'storefront_menu_toggle_text', __( 'Shop Menu', 'storefront' ) ) ); ?></span></button>
<?php
wp_nav_menu( array(
'menu' => 'Shop',
) );
?>
</nav><!-- #site-navigation -->
<?php
}
}
While my primary, handheld menu toggles the menu 'shop' does not. I'm currently going through the navigation.js in the storefront theme but my javascript capabilities are very limited and I feel like I'm turning in circles.
Maybe someone of you can help? Thanks a lot