Trigger option not available

Hi Tim,

Thanks a lot for reaching out. We have tried for the menu trigger solution before. But we found a few complexities there. The menu is one of the complex things in WordPress Structure, you know.

Still, we are trying to find a better solution for this. Hopefully, we can manage it in any of our future updates. But I’m sorry to inform you that I don’t have the exact ETA for you right now.

Hope you understand.

Regards,
Mehedi

I just got it with some CSS ovverides and a small javascript click event. Working fine.

Glad to know that you have the solution with the CSS override and JavaScript click event. It will be more pleasing for me if you share the solution with me.

I put this function into my JS:

jQuery(function() {
    jQuery('.wp-megamenu-wrap .wpmm-nav-wrap > ul.wp-megamenu > li.wpmm_mega_menu').click(function() {
        jQuery(this).toggleClass('active');
    });
});

And then just overwritten all CSS :hover commands of li.wpmm_mega_menu to normal state. Then I took the commands for the open state (formerly :hover) to the .active class, like this:

.wp-megamenu-wrap .wpmm-nav-wrap > ul > li > a {
  cursor: pointer;
}
.wp-megamenu-wrap .wpmm-nav-wrap > ul.wp-megamenu > li.wpmm_mega_menu:hover > ul.wp-megamenu-sub-menu,
.wp-megamenu-wrap .wpmm-nav-wrap > ul.wp-megamenu > li.wpmm_mega_menu:hover > .wpmm-strees-row-container > ul.wp-megamenu-sub-menu,
.wp-megamenu-wrap .wpmm-nav-wrap > ul.wp-megamenu > li.wpmm_mega_menu:hover > .wpmm-strees-row-and-content-container > ul.wp-megamenu-sub-menu,
.wp-megamenu-wrap .wpmm-nav-wrap > ul.wp-megamenu > li.wpmm_dropdown_menu:hover > ul.wp-megamenu-sub-menu,
.wp-megamenu-wrap .wpmm-nav-wrap > ul.wp-megamenu li.wpmm_dropdown_menu ul.wp-megamenu-sub-menu li.menu-item-has-children:hover > ul.wp-megamenu-sub-menu,
.wp-megamenu-wrap .wpmm-nav-wrap > ul.wp-megamenu > li.wpmm_mega_menu > ul.wp-megamenu-sub-menu > li.wpmm-row .wp-megamenu-sub-menu li.menu-item-has-children:hover > ul.wp-megamenu-sub-menu,
.wp-megamenu-wrap .wpmm-nav-wrap > ul.wp-megamenu li.wpmm-type-widget .wp-megamenu-sub-menu li:hover .wp-megamenu-sub-menu {
  display: none;
  visibility: hidden;
}
.wp-megamenu-wrap .wpmm-nav-wrap > ul.wp-megamenu > li.wpmm_mega_menu.active > ul.wp-megamenu-sub-menu,
.wp-megamenu-wrap .wpmm-nav-wrap > ul.wp-megamenu > li.wpmm_mega_menu.active > .wpmm-strees-row-container > ul.wp-megamenu-sub-menu,
.wp-megamenu-wrap .wpmm-nav-wrap > ul.wp-megamenu > li.wpmm_mega_menu.active > .wpmm-strees-row-and-content-container > ul.wp-megamenu-sub-menu,
.wp-megamenu-wrap .wpmm-nav-wrap > ul.wp-megamenu > li.wpmm_dropdown_menu.active > ul.wp-megamenu-sub-menu,
.wp-megamenu-wrap .wpmm-nav-wrap > ul.wp-megamenu li.wpmm_dropdown_menu.active ul.wp-megamenu-sub-menu li.menu-item-has-children > ul.wp-megamenu-sub-menu,
.wp-megamenu-wrap .wpmm-nav-wrap > ul.wp-megamenu > li.wpmm_mega_menu.active > ul.wp-megamenu-sub-menu > li.wpmm-row .wp-megamenu-sub-menu li.menu-item-has-children > ul.wp-megamenu-sub-menu,
.wp-megamenu-wrap .wpmm-nav-wrap > ul.wp-megamenu li.wpmm-type-widget.active .wp-megamenu-sub-menu li .wp-megamenu-sub-menu {
  animation-duration: 300ms;
  display: block;
  top: auto;
  opacity: 1;
  z-index: 1;
  visibility: visible;
}
.wp-megamenu-wrap .wpmm-nav-wrap > ul > li > a {
  pointer-events: none;
}

The only issue now is the curser:pointer; but it’s ok for me.

And now much better for Mobile devices, if u don’t want to have a mobile menu. For me it’s a 3 level accordion with posts now ??

Thanks a lot for sharing the codes.

You’re welcome! On other sites I think it will not be exactly the same, but maybe it’s an inspiration to add this function to you’re Plugin ??

Surely, we will apply this in our future update. If you are happy with our product and support, I would request you to share your thoughts on the reviews section. Here is the link to post a review- https://www.ads-software.com/support/plugin/wp-megamenu/reviews/#new-post