Archived topic
Cumulative Layout shift is giving me issues.
2 replies · Started by Abdulrahman on March 7, 2021
Any idea how to resolve this? I am trying to bring down Cumulative Layout shift. I am using WP rocket/cloudflare. Let me know if you have any questions
There are two that are giving me issues. I would like to get site-footer grid-container solved for sure as it is showing up in mobile and desktop.
<div class="site-footer grid-container"> ->1.012 CLS
nav id="nav-below" class="paging-navigation masonry-brick" style="opacity: 1;"> -> 0.131 CLS
Desktop only:
<article id="post-1722" class="post-1722 post type-post status-publish format-standard has-post-thumbnail…" itemtype="https://schema.org/CreativeWork" itemscope="" style="position: absolute; left: 33.3326%; top: 0px;">
I created a thread yesterday and figured it was resolved if I removed one of the widget's in the footer but the issue still remains (site-footer grid-container).
Any idea how to proceed?
I added login credentials in case support wants to take a closer look.
EDIT: I turned off WP Rocket and it didn't fix it. Still high CLS.
EDIT2: I managed to fix the CLS for both using:
add_filter( 'option_generate_blog_settings', 'db_disable_masonry_mobile' );
function db_disable_masonry_mobile( $options ) {
if ( wp_is_mobile() ) {
$options['masonry'] = false;
}
return $options;
}The only other thing I need help with is the CLS for:
<article id="post-1722" class="post-1722 post type-post status-publish format-standard has-post-thumbnail…" itemtype="https://schema.org/CreativeWork" itemscope="" style="position: absolute; left: 33.3326%; top: 0px;">
Edit 3: I just disabled masonry on mobile+desktop and it works fine now.
Hi there,
I've checked your site's performance on Google PSI and it both scored 99/100 with CLS of 0.
Edit 3: I just disabled masonry on mobile+desktop and it works fine now.
Have you fully sorted this out? Thank you for sharing it with us.
