Back to Documentation

WooCommerce Product Image sizes

What to do if your WooCommerce product images are displaying blurry on your website.

July 11, 2019

When uploading product images for WooCommerce, we recommend you prepare all the images onto the same size canvas / template before uploading them to your website.

This will prevent them displaying at different sizes/heights and stop them from showing up blurry.

Uploading the same size images will ensure WooCommerce can do the cuts correctly and display them neatly on your site.

Note: Dimensions you specify on the Products tab of the WooCommerce settings screen affect the size of the thumbnails that the theme uses when displaying product images. They do not change the size that the image is rendered.

If you upload an image smaller than the specified cut then it’ll insert the full size image and this is how they display at different sizes and become blurry/pixelated.

Now that all image sizes for your online store are correct, you can add new dimensions to ensure that future thumbnails will be correct.

Under Customize -> WooCommerce -> Product Images, be sure that the maximum image sizes are within the size uploaded… and if you need to change the product cut sizes then you can save the new dimensions and you’ll then need to Regenerate Thumbnails.

Blurry Product Images:

Read more about image sizes on the WooCommerce documentation: