[gigasloop]

I have a secondary menu that I am conditionally swapping out using the Menu Swapper plugin. Basically I have an empty secondary menu and then several additional menus that are displayed based on selecting them in the page attributes. This works very well with your theme except when viewed on mobile.

When viewed on the desktop browsers, the pages that have the “empty menu” don’t show any secondary menu at all. (that is what I want). However on mobile devices they are showing a blue menu bar that says “Menu” with the 3 dashed lines – nothing drops down since the menu is empty.

Via CSS I have figured out that I could hide this menu in all cases however I do want to show it in some cases. I could do this by page ID of course but I have 20 or so pages in this condition which makes for some ugly css.

Is there any way to fix this? Or another reference I can use in the CSS to make it display conditionally?

Site is at http://c34.org/wordpress

Example of page where no secondary menu should appear – http://c34.org/wordpress/owner-database/

Example of page where secondary menu should appear
http://c34.org/wordpress/fleet-1/

This is not an issue with the plug-in as I see the same “Empty menu” in mobile view without the plugin installed.

[Pratik]

Hi @gigasloop,
A few things:
1. If you want to do it via CSS, then you will need to add some multiple CSS as you have mentioned which will look ugly, but do the work
2. If you want a cleaner solution, then you will need to tinker with some coding. I do not see any other way for this.

Please let me know if there is any further help needed.

Regards,
Pratik

[Author]

Posts