Hi Elias,
If I understand correctly, you need to go to Mega Menu > Menu Themes and enable “Highlight current item”.
Regards,
Tom
Thread Starter
Elias
(@eliaslange)
Hi Tom,
you are right for highlighting the current item or menu link. But as you can see here http://www.designchemical.com/lab/demo-wp-menu-css/parent-a/ the submenu is always visible as well.
I would like to achieve the same with Max Mega Menu and hope this is possible.
Elias
Hi Elias,
The official line is it’s not a supported feature.
Unofficially you could try adding this to your themes functions.php file:
function megamenu_keep_active_submenu_open( $classes, $item, $args ) {
if ( ( in_array( 'mega-current_page_ancestor', $classes ) || ( in_array( 'mega-current_page_item', $classes ) || in_array( 'mega-current-menu-ancestor', $classes ) ) && in_array( 'mega-menu-item-has-children', $classes ) ) ) {
$classes[] = 'mega-toggle-on';
}
return $classes;
}
add_filter( 'megamenu_nav_menu_css_class', 'megamenu_keep_active_submenu_open', 10, 3 );
Results may vary, it will only work in very specific circumstances (hence I can’t ever see it being a real feature of the plugin).
Regards,
Tom
Hi Tom,
Referring to the demo from the site of Elias, is it possible to have a flyout menus in top level and second/third level of sub-menu to use Mega menu? Because only the (top level) menu item can be created a panel for with Mega menus.
If it is feasible, how can it be created? I would like to create a menu like this:
image
Thanks in advance!
Regards,
Yee
Thread Starter
Elias
(@eliaslange)
Hi Tom,
thanks for your feedback and solution – which as you have said – only work in very specific circumstances.
However I’ve managed with pure CSS to display the submenus of active/current main menu links.
If anyone is looking for this here is the code.
#mega-menu-wrap-main_navigation #mega-menu-main_navigation li.mega-menu-item > ul.mega-sub-menu {
display: none !important;
visibility: hidden !important;
}
#mega-menu-wrap-main_navigation #mega-menu-main_navigation li.mega-current-menu-item > ul.mega-sub-menu,
#mega-menu-wrap-main_navigation #mega-menu-main_navigation li.mega-current-menu-ancestor > ul.mega-sub-menu {
display: block !important;
visibility: inherit !important;
}
#mega-menu-wrap-main_navigation #mega-menu-main_navigation > li.mega-current-menu-item > ul.mega-sub-menu > li.mega-current-menu-item > a.mega-menu-link,
#mega-menu-wrap-main_navigation #mega-menu-main_navigation > li.mega-current-menu-ancestor > ul.mega-sub-menu > li.mega-current-menu-item > a.mega-menu-link {
color: #white;
font-weight: normal;
text-decoration: none;
background: #grey;
The only problem I still have is that the submenu is overlapping the content which I still have to figure out. Maybe you have an idea how to fix this?! —> http://nap.li/s/wxbmgaXiyd1rjDc (animated menu image)
Elias
