Mystique
When Max Mega Menu is enabled in Mystique you will see 2 main menu bars and a duplicate mobile toggle button.
Step 1. Remove duplicate menu bar and mobile toggle button
Go to Appearance > Editor and select ‘core.php’ on the right. Note: changes to theme files should be made in a Child Theme.
Find:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
<nav class="main-nav"> <div class="kid-site-container"> <div class="header-inner clear-fix"> <div class="mobile"> <i class="fa fa-bars"></i> </div> <?php wp_nav_menu( array( 'theme_location' => 'menu-main', 'container_id' => 'main-menu', 'walker' => new kid_Walker, 'depth' => '3' ) ); wp_nav_menu( array( 'theme_location' => 'menu-main', 'depth' => '2', 'container_id' => 'main-mobile-menu' ) ); ?> </div> </div><!-- main-nav-inner --> </nav> |
Replace with:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
<nav class="main-nav"> <div class="kid-site-container"> <div class="header-inner clear-fix"> <?php if ( function_exists( 'max_mega_menu_is_enabled' ) && max_mega_menu_is_enabled( 'main-menu' ) ): ?> <?php wp_nav_menu( array( 'theme_location' => 'menu-main' ) ); ?> <?php else: ?> <div class="mobile"> <i class="fa fa-bars"></i> </div> <?php wp_nav_menu( array( 'theme_location' => 'menu-main', 'container_id' => 'main-menu', 'walker' => new kid_Walker, 'depth' => '3' ) ); wp_nav_menu( array( 'theme_location' => 'menu-main', 'depth' => '2', 'container_id' => 'main-mobile-menu' ) ); ?> <?php endif; ?> </div> </div><!-- main-nav-inner --> </nav> |
Step 2: Fix mobile menu z-index
Go to Mega Menu > Menu Themes and insert the following into the Custom Styling area:
|
1 2 3 4 |
#{$wrap} { position: relative; z-index: 99999; } |