[Support request] Navigation Menu Loads Below Intended Position

[Eugen]

I have been trying to investigate and fix the last couple of things for Page Speed prior to the May update. One of the things that bother me is the CLS score for PC. Using the performance report from Chrome I have realized that the menu loads roughly 100px below its intended position and shifts immediately back.

As a user, I am not able to spot that shift, but the report can and I assume that for someone with slower internet it might be an issue.

The issue only occurs for the computer view, and the mobile view does not have this issue although still loads the main article header slightly below and shifts it up too.

[David]

Hi there,

you have 2 issues:

1. your Logo is being lazy loaded, which is causing the CLS, in WP Rocket you can exclude the Logo from being lazy loaded by adding this PHP Snippet to your site:

function rocket_lazyload_exclude_class( $attributes ) {
	$attributes[] = 'class="is-logo-image"';

	return $attributes;
}
add_filter( 'rocket_lazyload_excluded_attributes', 'rocket_lazyload_exclude_class' );

Adding PHP: https://docs.generatepress.com/article/adding-php/

2. the bigger issue is your using WP Rockets Critical CSS – unless you know how to write your own Critical CSS this featured should be disabled. The automated option is missing above the fold CSS that then gets deferred to after the page is loading.

[Author]

Posts