Menu above built with this plugin including Mega Menu.

How Do I Hide The Original Menu?

When your site is resized and the Responsive Menu shows, how do you stop your original menu from showing.

For this we will need to edit the following 2 settings:

  • Menu Breakpoint
  • CSS of Menu To Hide

This can be a bit more complex and if you know nothing about CSS then you may get lost here, however it really isn’t hard once you know what you are looking for.

In this box you will need to add either the ID prefixed with # or a unique class prefixed with . of the containing element of your original menu.

For example if your original menu looked like this:

<div id="main-menu">Home / About / Contact</div>

Then you would add #main-menu to this box. Alternatively:

<div class="main-menu">Home / About / Contact</div>

In this case, you would need to add .main-menu, due to the fact that this is now a class and not an ID.

To find the correct element to hide you can either look at your Themes source files, use a tool like Firebug or Console Tools (by hittig F12) or looking at the source code of the site.

From the FAQ

Hiding the Menu on Specific Pages
Setup a Desktop Menu
Using as your Main Menu
Hide the Theme Menu
Menu Not Showing