[Support request] slow site preview incorrect thumbnail images

[Ceramica Sud Curlante]

The file size of the thumbnail image is incorrect.
It would appear that you see the full size image weighing down the site.

[Fernando]

Hello there,

First off, it’s the WooCommerce plugin that’s controlling the sizes of the images displayed. Then, the warning “Properly size images” triggers when the rendered image is 4kB greater or less than the actual size of the image. Unless the images are properly sized and well optimized, this warning will always trigger.

The rendered size of the images with the issue is just 170 x 96px.

You can try adding this PHP snippet and see how it goes:

function set_max_srcset_width( $max_width ) {
    if ( class_exists( 'WooCommerce' ) && is_shop() ) {
        $max_width = 170;
    } else {
        $max_width = 768;
    }
    return $max_width;
}
add_filter( 'max_srcset_image_width', 'set_max_srcset_width' );

Adding PHP reference: https://docs.generatepress.com/article/adding-php/#code-snippets

In this code there are two $max_width variables.

First one: $max_width = 170; This will be the largest size used on the shop. It’s value should match what you have in your Product Catalog width.

The second one: $max_width = 768; is for every other page in your site and should be set to the largest image size you require.

Then, I would also suggest using an image optimization plugin, and a CDN.

Hope this helps!

[Ceramica Sud Curlante]

OK, it works on almost everything.
It does not work for me only for these further miniatures, I am attaching an example image.

[Fernando]

How did you add these images? Can you try using an Image Optimization plugin, and a CDN as well? These should help with the image issues.

Hope this helps!

[Author]

Posts