Site logo

Archived topic

Web Core Vital in Generatpress

11 replies · Started by Iswan on November 14, 2020

Viewing posts 1–12 of 12

Hai. I use Generatepress in my web.

But i found problem in my Google Search Console that my web have a poor web core vital...

Could you give me a solution?

Hi there,

That's a pretty broad statement for us to help unfortunately.

Did the search console provided any details on what they are referring to?

Do you get the same result if all plugins disabled except GP Premium?

Not my thread, but on the subject, I found that the logo is a problem because since there's no height on the IMG tag, it does cause a layout shift when it does gets downloaded and shows up.

Not really significant to the eye test but the shift is there for Web Vitals.

If you're using GP 3.0 with flexbox enabled, the logo should have dimensions in its HTML :)

Sounds like something that will break some stuff and also sounds like something I should do because I guess long term that's the way you're going.

How can I enable that just to test?

You can enable it in the Customizer and you'll see the live preview load. That should show you whether your site is compatible. The only time it won't be is if you have a lot of custom CSS/HTML.

Hai Tom, Sorry for my late respons... And thx for you & team quick respond....

I have trouble in LCP n CLS
Score of LCP is 3.1s and CLS is 0,36, its beat me and effect to my SEO strategy.

I dont want to change generatepress, cz i still believe GP is one of best theme in world...

So plis gimme some advice to save my blog.

Hope you and tim can fix this.

Cheers...

Hi there,

the main issue i see is TTFB ( Time to First Byte ). Run a GTMetrix test on you site and you will see a long waiting time for the initial request to be processed by your server. Have a word with your Hosting company, any improvements you can make to the server response times will improve overall performance.

LCP Issues -

1. you have Lazy Loading applied to all images, you should exclude the Logo from this as its causing layout shift. Most Lazy Loaders let you exclude images by CSS Class, you can use: is-logo-image to eliminate the logo.

2. Fonts are taking a while to load, during which time they are set to fallback to a system font, this is causing a slight layout shift. There are various fixes to this such as preconnect to the google server or simply try serving them locally - this plugin does that for you:

https://wordpress.org/plugins/host-webfonts-local/

Thanks David,

Can you give me the code to exlude lazy load? I am not a programmer, i just do copy and paste, i was search in google but i can't understand...

I use lazyload from wp rocket.

Can you suggest me... Where i put the code, in function.php or etc.

This PHP Snippet:

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

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

Here is WP Rockets reference article for that:
https://docs.wp-rocket.me/article/15-disabling-lazy-load-on-specific-images

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

TLDR: If you're using a Child Theme then you would place the code in the Child Themes functions.php - if you're not using a Child Theme then install the Code Snippets plugin, and add the code to a new snippet.

Thanks david for your super support...

GP is the best theme in world...

You're welcome - glad we could be of help!

This archived topic is closed to new replies.