Remove Default Mobile Menu from Underscores

WordPress Underscores theme comes with a default primary menu that toggles to a mobile menu button at 600px wide. If your project requires using another mobile menu solution it is best to remove the existing one and here’s how.

underscores mobile menu


You can disable this menu and behaviour by removing the wp_enqueue_script to the navigation.js file in functions.php

 //wp_enqueue_script( 'underscores-navigation', get_template_directory_uri() . '/js/navigation.js', array(), '20120206', true );

Then in style.css tweak the menu section

Since the mobile button is now gone you can also remove the button mark up from header.php

 <button class="menu-toggle" aria-controls="primary-menu" aria-expanded="false"><?php esc_html_e( 'Primary Menu', 'underscores' ); ?></button>

Now you can add in another mobile menu solution without any conflict.