Woo Product images fuzzy in category page

[lisacole1]

https://www.thehummingbirdlodge.com/product-category/courses/

Hiya, what size should I make the product images so they are not fuzzy? They are set to 1200 on the actual product and that doesn’t look so bad, but on the category page it looks awful.

thanks!

[mldarshana]

Hi There,

Thanks for writing in! Could you please try adding the following CSS rule into your Theme Options > Global CSS area.

.woocommerce li.product .entry-featured img {
    min-width: 300px;
}

Hope that helps.

[lisacole1]

@mldarshana

.woocommerce li.product .entry-featured img {
min-width: 300px;
}

Thank you but that is worse, it just puts the blurry picture inside a box.

[rad]

Hi there,

Are you sure you set it to 1200px? The code is still displaying the 300x300

<img width="300" height="300" src="https://www.thehummingbirdlodge.com/wp-content/uploads/2018/04/Embodying-Module-1-300x300.jpg" class="attachment-shop_catalog size-shop_catalog wp-post-image" alt="">

Have you tried installing Force Regenerate thumbnails plugin and regenerate them? Changing image size will only take effect to newly added images, existing will remain on its size.

And please provide your site’s login credentials so we could test it too. The size is being pulled from Woocommerce setting and not from the theme (shop_catalog).

Thanks!

[lisacole1]

thank you.
I’ve removed your code because I didn’t like the boxes around the images, I regenerated the thumbnails and they still look fuzzy either way.

[thai]

Hi There,

I’ve changed the Thumbnail width to 1200:

Could you please regenerate the thumbnails again?

Thanks.

[lisacole1]

ace, thank you so much! all sorted, you are brilliant.

[christian]

You’re welcome. Glad we could help.