Tom Hemsley – Page 5 – Max Mega Menu

How to disable the sticky menu on a specific page

Posted by Tom Hemsley on March 2, 2020

Add the following code to your themes functions.php page to disable the sticky menu on a specific page.

function megamenu_disable_sticky_on_page( $attributes, $menu_id, $menu_settings, $settings, $current_theme_location ) {
	if ( is_page('cart') || is_page('checkout') ) {
		$attributes['data-sticky-desktop'] = 'false';
		$attributes['data-sticky-mobile'] = 'false';
	}

	return $attributes;
}
add_filter("megamenu_wrap_attributes", "megamenu_disable_sticky_on_page", 10, 5);

function megamenu_disable_sticky_on_page( $attributes, $menu_id, $menu_settings, $settings, $current_theme_location ) {

if ( is_page('cart') || is_page('checkout') ) {

$attributes['data-sticky-desktop'] = 'false';

$attributes['data-sticky-mobile'] = 'false';

}

return $attributes;

}

add_filter("megamenu_wrap_attributes", "megamenu_disable_sticky_on_page", 10, 5);

In the example above we are detecting the “cart” page. You may find WordPress core functions including is_page, is_front_page and is_single useful in detecting the correct page to disable the sticky…

Petcare Lite

Posted by Tom Hemsley on February 6, 2020

Fix Mobile Menu Copy the themes header.php file to your child theme. In the header.php file, find:

    <div class="header_right">        		              
              <div class="toggle">
                <a class="toggleMenu" href="#">
                <?php esc_html_e('Menu','petcare-lite'); ?>                
            </a>
            </div><!-- toggle -->    
            <div class="sitenav">                   
                <?php wp_nav_menu( array('theme_location' => 'primary') ); ?>                   
            </div><!--.sitenav --><div class="clear"></div>                  
        </div><!--header_right--><div class="clear"></div>

<?php esc_html_e('Menu','petcare-lite'); ?>

</a>

</div>

<?php wp_nav_menu( array('theme_location' => 'primary') ); ?>

</div><div class="clear"></div>

</div><div class="clear"></div>

Replace with:

    <div class="header_right">        		                
            <div class="sitenav-mmm">                   
                <?php wp_nav_menu( array('theme_location' => 'primary') ); ?>                   
            </div><!--.sitenav --><div class="clear"></div>                  
        </div><!--header_right--><div class="clear"></div>

<?php wp_nav_menu( array('theme_location' => 'primary') ); ?>

</div><div class="clear"></div>

</div><div class="clear"></div>

Sticky Menu

Posted by Tom Hemsley on January 24, 2020

Using Max Mega Menu Pro it is possible to make your menus stick to the top of the page as the user scrolls down. Making a menu sticky / fixed To make a menu stick to the top of the page when the user scrolls down, go to Mega Menu…

Consultix

Posted by Tom Hemsley on November 13, 2019

Fix Mobile Menu By default the mobile menu will be displayed within a slide out panel, but opening the mobile sub menu will not work. To make it work we must hide the standard theme menu and reveal the Max Mega Menu mobile menu instead. Go to Mega Menu >…

Twenty Twenty

Posted by Tom Hemsley on November 12, 2019

Full Width Sub Menus By default the sub menus will only be as wide as the menu itself. To make the Mega Sub Menus span the full width of the page, go to Mega Menu > Menu Themes > Mega Menus and set: Panel Width (Outer): .header-inner Panel Width (Inner):…

Divi 4

Posted by Tom Hemsley on October 18, 2019

Divi 4 includes a new header builder. The addition of the header builder allows us to perfectly integrate Max Mega Menu with Divi without the need for custom code or a child theme. Step 1 – Create the menu This step is the same for all themes. First we need…

How to display WooCommerce categories in your menu

Posted by Tom Hemsley on October 10, 2019

In this article we will go through the steps required to show WooCommerce categories within your menu. Step 1: Enable WooCommerce Categories Go to Appearance > Menus and expand the “Screen Options” section at the top right of the page. Enable “Product categories” and “Product tags”. Step 2: Menu Setup…

Widget

Posted by Tom Hemsley on September 20, 2019

Max Mega Menu comes with a built in widget which allows you to display a single menu location within a widget area. Depending on your theme, you might have widget areas set up in the header, footer and sidebar areas. Using the following method we can add a Mega Menu to…

Mobile Menu

Posted by Tom Hemsley on September 19, 2019

The Responsive Breakpoint Your mega menu will automatically collapse down to a mobile style menu on smaller screens. To test the mobile menu simply reduce the width of your browser window. You can adjust the screen width at which the menu converts to a mobile style using the Responsive Breakpoint…

Airi

Posted by Tom Hemsley on September 2, 2019

Fix Mobile Menu Airi automatically closes the mobile sub menu when any of the links are clicked, and also adds an extra sub menu toggle icon. To fix both of these issues, install the TC Custom JavaScript plugin then go to Appearance > Custom JavaScript and add the following:

jQuery(document).ready(function($){
  jQuery('body.mega-menu-menu-1 #site-navigation').unbind();
  jQuery("body.mega-menu-menu-1 .header-search-cart").remove();
  jQuery("body.mega-menu-menu-1 .header-mobile-menu").remove();
  jQuery("body.mega-menu-menu-1 #mega-menu-wrap-menu-1 .subnav-toggle").remove();
  jQuery("body.mega-menu-menu-1 .main-navigation").removeClass('main-navigation');
});

jQuery(document).ready(function($){

jQuery('body.mega-menu-menu-1 #site-navigation').unbind();

jQuery("body.mega-menu-menu-1 .header-search-cart").remove();

jQuery("body.mega-menu-menu-1 .header-mobile-menu").remove();

jQuery("body.mega-menu-menu-1 #mega-menu-wrap-menu-1 .subnav-toggle").remove();

jQuery("body.mega-menu-menu-1 .main-navigation").removeClass('main-navigation');

});

…