[Resolved] Images in my Woocommerce store are blurry

[Susan Snyder]

We are building a store as part of our Generate Press built site using Woocommerce and I am running into an issue with the default product page. The related product images at the bottom of the page are really blurry. I looked at the code and while they display at 370 x 370 pixels, the image source they are linking to seems to be the resized thumbnail or catalog image file which is 150 x 150 pixels. I had created all original product images at 300 x 300 pixels because that was the default for the large image size in the Woocommerce settings. I may need to rework and reload them all because the main image is a bit blurry too unless I can figure out how to get the display size to correspond with the image source size.

[Tom]

Hi Susan,

When you change the size of the images in the WooCommerce settings, you may need to rebuild your thumbnails using a plugin like this: https://wordpress.org/plugins/regenerate-thumbnails/

Let me know if that does it 🙂

[Susan Snyder]

I had read about that while trying to resolve the issue. My issue is not that I want to resize my images in Woocommerce – right now the image settings are catalog: 150 x 150 px, thumbnail: 150 x 150 px and single product image: 300 x 300 px. The default template product template is pointing to one of the smaller sizes for related products – either thumbnail or catalog – and then is displaying at 370 x 370 pixels. I don’t really want to reset the catalog or thumbnails to be that large as it may alter the image quality in other areas of the store which – other than this – looks great so far. The store is not yet public but, if it would help, I could post a link to one of the product pages. I would like to either change the settings for which image it is pointing to or resize the display settings.

[Tom]

A link would definitely be helpful.

GP doesn’t actually change any of the WooCommerce settings, it just adds the necessary markup for the WC templates to match the rest of the site.

That makes me think this is more of a WC issue than a GP issue.

If you’d like to link me to the page, I might be able to find out more.

[Susan Snyder]

It’s so hard to tell who to contact with all of the various add-ons to get things working as a whole. Here is a link to one of the product pages: http://www.aeideas.com/?product=juggling-scarf-kit-18×18. If you look at the related product images they are really blurry and if you inspect the element you can see that the images being pulled in are 150 x 150 px and the display size is 370 x 370 px… I’d rather not go live with blurry images if it can be helped. Thank you for all of your assistance!

[Tom]

This seems to be a common issue with WC.

There’s some solutions posted here: https://wordpress.org/support/topic/plugin-woocommerce-excelling-ecommerce-related-product-image-is-too-big

Let me know 🙂

[Author]

Posts