[SOLVED] Improve quality of woocommerce thumbnails on product page

Improve quality of woocommerce thumbnails on product page

I am trying to improve the quality of Wooommerce thumbnails on product page, but with no results. The thumbs are always displayed blurry not matter what I do.

I have tried different plugins like for retina etc, regenerated thumbs, uploaded via ftp new photoshopped 300 dpi imgs and replaced them with the ones which were in the gallery, uploaded bigger imgs, disabled jetpack, played with the different img settings in woocommerce and wordpress (set quality to 100%/scaling etc), put this string into functions.php file add_filter('jpeg_quality', function($arg){return 100;}); and so on, still nothing.

So I think there is some settings that are maybe related to FlexSlider, the slider woocommerce uses. It might be related to Woolentor as well? Using Astra theme + Elementor. I'm clueless.

Here's a link to a product page on my website (eg. check be quiet! logo, blurry in the thumbnails gallery, orginal image is 900x900px): https://gamingaddicted.it/prodotto/handpicked-red-chillies/

Thanks in advance!

Solution

You could do it with this code bellow or directly with the customizer on your website. Here is the url with some tips, maybe you should take a look at them. - TIPS HERE

Add this code to your theme's functions.php file and change the width and height as you wish.

/*change thumbnail quality in woocommerce*/
    add_filter( 'woocommerce_get_image_size_gallery_thumbnail', function( $size ) {
        return array(
            'width' => 600, //change this to edit thumbnail witdth - default 150px
            'height' => 600, //change this to edit thumbnail height - default 150px
            'crop' => 0,
        );
    } );