[Support request] Menu layout shift on page load

Home Forums Support [Support request] Menu layout shift on page load

Home Forums Support Menu layout shift on page load

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #1562061
    Hilton

    Hi,

    I have been trying to fix a problem in the mobile menu but without success. When loading the pages of my website, the menu becomes higher, and then goes to normal height.

    This is the moment when the menu area at the top becomes strange, higher than normal https://prnt.sc/vt060o

    Soon after she returns to normal height https://prnt.sc/vt06be

    But it happens on all the browsed pages, which I find strange, I think it shouldn’t happen.

    Are there any changes I can make to correct this problem?

    #1562158
    Hilton

    Just to complement the information, besides CSS changes, I am using this function below.

    add_filter( 'generate_navigation_search_output', function () {
    	printf(
    		'<form method="get" class="search-form navigation-search" action="%1$s">
                <input type="search" placeholder="Buscar ..."  class="search-field" value="%2$s" name="s" title="%3$s" />
                <input type="submit" class="search-button" value="">
            </form>',
    		esc_url( home_url( '/' ) ),
    		esc_attr( get_search_query() ),
    		esc_attr_x( 'Search', 'label', 'generatepress' )
    	);
    } );

    It seems something related to the search icon loading first below the hamburger menu and then going to the right place.

    #1562865
    Elvin
    Staff
    Customer Support

    Hi,

    Can you try disabling the cache first and see if it still occurs?

    Let us know.

    #1563613
    Hilton

    This observation was very interesting. I thought it couldn’t be related to the cache but by disabling the cache for mobile devices the problem was fixed. I believe you have to contact WP-Rocket support to find out how to resolve this.

    #1563878
    David
    Staff
    Customer Support

    Hi there,

    the issue will be related to the cache plugins settings. WP Rocket provide this Troubleshooting guide to help find which of their settings is causing the problem:

    https://docs.wp-rocket.me/article/106-my-site-is-broken

    #1564465
    Hilton

    Hi David,

    I disabled all the features from WP-Rocket and enabled them one by one until I discovered that it was the Image Lazyload that was causing this problem. So following the tutorial, I added a new function that seems to have corrected it.

    function rocket_lazyload_exclude_class( $attributes ) {
    	$attributes[] = 'class="is-logo-image"';
    
    	return $attributes;
    }
    add_filter( 'rocket_lazyload_excluded_attributes', 'rocket_lazyload_exclude_class' );

    Thanks

    #1565394
    David
    Staff
    Customer Support

    Glad to hear that!

Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.