The Goal:
Make product images for WooCommerce less blurry.

Some themes will compress and shrink the file size of your product images to help your pages load faster, however this can occasionally cause blurry images. Some themes allow you to override this in the dashboard, but others might not offer this and you can’t access it unless you override it in your functions.php.

Requirements:

  • Access to functions.php

Before

After

functions.php

Add this to your functions.php scripts at the bottom.

[cc lang=”html”]
// Stop blurry images
add_filter( ‘woocommerce_get_image_size_gallery_thumbnail’, function( $size ) {
return array(
‘width’ => 250,
‘height’ => 250,
‘crop’ => 0,
);
} );

add_filter( ‘woocommerce_get_image_size_single’, function( $size ) {
return array(
‘width’ => 1400,
‘height’ => 1400,
‘crop’ => 0,
);
});
[/cc]

Share This