Max Mega Menu: Unexpected Mobile menu bar

[wpjap]

Hi.

I set up my site with the primary menu (at the top, and fixed on scroll) to be visible in mobile and invisible in desktop. Works fine so far.
Then I loaded the plugin Max Mega Menu and told it to replace the built-in primary menu.
Unfortunately now the primary menu bar shows in desktop aswell, and in mobile view it doesn’t fix to top on scroll.
I put a few screenshots here: https://postimg.cc/gallery/1kdiihx3y/ See shots of the state without Max Mega Menu (OFF) compared to the state with Max running (ON). Also shot some settings pages.
The site is here https://tinyurl.com/yayz7mts

BTW, that menu on the left is a Navigation widget.

Hope someone can help!
Thx!

[Weaver]

Menu plugins don’t necessarily work well with default theme menus.

I doubt there is anything that can be done with Weaver options to fix this. Perhaps with some custom CSS.

Maybe an easier way would be to duplicate primary menu definition (you can define many menus). Hopefully the plugin can actually use any defined menu, and not necessarily the primary one. You could also maybe try to use the secondary menu with the theme.

But if you can designate two different menus with the theme and the plugin, the interaction may be reduced. But it may not be possible to prevent the plugin menu and the theme menu from competing for the same space on the screen.

Side note: while screen shots might help, in general they do not provide the kind of information we need to help diagnose problems. Usually, only a link to a site helps.

[scrambler]

I am not sure what you expected.

The theme can manage its own elements, but has obviously no control over plugins content.

If you use a plugin to do your menu, you need the plugin to provide the features you need. You should ask them if they do have options for what you want.

That said, the theme has tools to apply custom CSS only on certain devices and a class you can add to your own HTML to fix content to top on scroll.

To hide the menu manually on desktop, add the rule below to the Theme Global Custom CSS Rule box

.is-desktop #nav-primary {display:none;}

Fixing the mega menu may prove more difficult. The article below explain how you can attempt it

Script: Fix anything to Top on Scroll

basically the Mega menu plugin would need to let you add a specific class (wvrx-scrollfix) to the menu div that has the ID mega-menu-wrap-primary

So you need to speak to them and see if that is a possibility.

 

[wpjap]

Thanks for your hints! They helped me solve the problem:

I’m not using any of the theme’s menu locations, I set them invisible on all devices.

I created a Max Mega Menu location, activated it and put it as a Max Mega Menu widget into the Header Widget Area, set that to fixed, and 100%-width, adjusted some padding, and voila!

 

[Author]

Posts