The photos looked sharp when you uploaded them, but on the shop page they are blurry, the tops of products are cut off, the rows are uneven because every image has a different height, or some products show the grey placeholder image. WooCommerce does not show your original photo on the shop page: it shows smaller copies (thumbnails) made at the sizes your theme and settings ask for. Most image problems come from those copies. Below is a rebuilt example (not a real client), the two checks that find the cause, and the fix for each one.
Go to Appearance > Customize > WooCommerce > Product Images (with a block theme, the same settings may be under the theme's or WooCommerce's own options). Note the Main image width, the Thumbnail width and the Thumbnail cropping choice: 1:1, Custom, or Uncropped. Uncropped keeps each photo's own shape, so a mix of tall and wide photos gives uneven rows. 1:1 crops from the centre, which can cut off the top of a tall product.
Right-click a blurry image on the shop page and open it in a new tab. The address ends with the size of the copy, for example apron-300x300.jpg. If that copy is smaller than the space the theme shows it in, it is stretched and looks soft. Then open the product in the Media Library and look at the original's size: a photo smaller than about 1000 pixels wide cannot be made sharp by any setting.
| What you see | Cause | Fix |
|---|---|---|
| Images are blurry, and the copy's size (like 300x300) is smaller than the space on the page | The thumbnail width is set lower than the theme displays it, or the theme was changed and the old copies remain | Raise the Thumbnail width to at least the size shown (twice that for sharp phone screens), publish, then let the copies rebuild (see the last row) |
| The original photo in the Media Library is small | No setting can add detail that is not in the photo | Upload a larger photo, around 1200 to 2000 pixels on the long side, and set it as the Product image again |
| Images look blotchy or smeared, but the sizes are right | An image optimisation or CDN plugin compresses too hard | Lower its compression level (for example from "aggressive" to "lossless" or "glossy"), then restore or re-optimise the product images |
| Shop rows are uneven, every image a different height | Thumbnail cropping is Uncropped and the photos have different shapes | Set cropping to 1:1, or Custom with the shape most of your photos already have (for example 3:4 for clothing) |
| The tops or sides of products are cut off | 1:1 cropping crops from the centre of tall or wide photos | Choose Custom with a ratio closer to your photos, or Uncropped, or re-shoot or pad the photos to one shape before upload |
| Some products show the grey placeholder image | No Product image was set, or an import could not fetch the image addresses | Set the Product image in the product's right sidebar. For imports, check the image URLs open in a browser and re-run the import with "update existing products" ticked |
| Zoom or the lightbox does not work on the product page | Zoom only shows when the photo is larger than its space, or the theme turned zoom off | Use a larger original photo. If it still does not zoom, the theme has disabled it; check the theme's options |
| You changed the settings but nothing looks different | Old copies are still on the server, or a cache is serving old pages | WooCommerce rebuilds copies in the background after a change, which can take a while on a big shop. To do it now, run the Regenerate Thumbnails plugin once, then purge every cache |
In a private window, open the shop page and one category page on a computer and on a phone. Check that the rows line up, nothing important is cut off, and a right-clicked image opens a copy at least as large as the space it fills.
Most of these take a few minutes once you know which one it is. If you would rather someone else finds and fixes it, that is what the box below is for. Related: WooCommerce products not showing and images not showing.