WooCommerce single page images being resized

I think the problem is Jetpack’s Photon. Your photos are being hosted on i2.wp.com and so I bet that they compress the png image quality to save space and bandwidth. Try turning photon off.

None of your cropping settings on WooCommerce are going to work. Photon handles all of that.

Hi,

Thank you for your prompt response – I have deactivated Photon. However, the images are still being enlarged – honestly, most of them are being enlarged only slightly; 8 or so px, but some by over a hundred.

Thank you

I would get higher resolution images.

Try adding this at the end of styles.css to stop enlargement:

.woocommerce div.product div.images img {
    width: auto !important;
}

You’re a genius. I suppose I will get higher resolution images to cover the width, but then they were still becoming blurry – your code fixed that – so I suppose I will leave them like they were, and once I replace the images, I will add the code (I know it doesn’t make sense, but it seems to appear properly with the code.

Thanks!

Update: now some of the images are appearing smaller than their original sizes – any ideas? Just a few of them – all others are appearing correctly

Thanks!

What do you mean you’re confused?

https://romeojuliettailor.com/product/mens-pants-1/

https://romeojuliettailor.com/product-category/mens-pants/

The reason why is because the images that you’ve uploaded are small so they expand to their full size on the page. If the images are expanded bigger then they will start to become blurry and we’re back at square one. The solution is to get higher resolution photos or accept it how it is.

Which image is appearing at a smaller size? Which page?
I think the problem is the sidebar on the right using up space so when you resize the window it will shrink the image until the sidebar is gone.

The images have been updated – they are 400 x 640, in other words, appearing smaller than their original sizes. Pants 1 page, as you pointed out, is one of them

You need to change the resolution of the product images in WooCommerce settings.

Go to WooCommerce > settings > products tab > display and then change the product image dimensions at the bottom to something bigger for the single product image. Then you may need to regenerate thumbnails.

Change the single product image to 400 x 640 then. Then regenerate thumbnails. There should be a plugin for that. Make sure you have php-gd installed (In Amazon Linux you have to install it seperately.)

Thanks