WooCommerce product grid images

Thanks Ismael,

So if I want to have four columns what size should I make the thumbnails?

At the moment they are 1080 x 772 and as you can see they are only just not fitting in the square. If I could reduce them a small bit to fit in the square that would be great.

When I reduce the image to 300 px I lose a lot of the quality of the image. Also at the moment when you click on the current image (I am not sure what to refer to them to? are those image on the page westcoasthammocks.com.au/superjumbo thumbnails or catalogue images?) you get through to the other product gallery images and when they are in full size of 1080 they are nice and big and you can see full detail. When I change the image size for the page i.e. down to 300 px then when you click through the product gallery images are also small and you can’t see the detail for example click on the image Original Rasta.

For Original Rasta I have downsized the image size but it is not downsized on the main page (catalogue or thumbnail) for some reason.

Ideally I would like them to fit in the box but retain the size so that when you click through you get the full image size 1080px.

OK I have to admit I am a little bit confused. Please would you help me to understand. My images that I have uploaded are 1080 x 772.

The catalog images are 450 px x 450 px. First please would you confirm that the catalog images refer to the images displayed on this page in the product grid? – http://westcoasthammocks.com.au/superjumbo/

The container is 1310 px wide. I assume this means the width of the useable space.

You say that WordPress is cropping images by default when uploading themes. Please can you clarify what this means and how it ties into the information above.

You also say that I can adjust Enfold’s image setting directly – I am not sure which image size relates to the images we are discussing and what changes should be made.

Really I would just like for the whole image to fit into the Woo Commerce product grid box while retaining the image quality. I appreciate your advice and help understanding how the system works.

Yes, that’s the catalogue image. Look at the following image for example, the image is cropped to 450x321px: http://westcoasthammocks.com.au/wp-content/uploads/2016/03/SJ-Lanta-CCU-e1461770115597.jpg

OK so the catalogue image are the images being displayed on the main page in the product grid. I cropped the image you have referenced above http://westcoasthammocks.com.au/wp-content/uploads/2016/03/SJ-Lanta-CCU-e1461770115597.jpg so that was nothing to do with anything else. I have changed it now back to its original size.

If you have images larger than the specified thumbnail size, WordPress will resize or cropped it until it pass the required thumbnail size. In this case, the maximum width of the catalogue images is set to 450x450px. Uploaded images will not exceed that dimension. If you want to prevent this, set the maximum width and height to the size of the actual image but the theme has to resize it via css to fit the column container.

OK now I have set the WooCommerce display settings for catalogue images to 1080×772 which is the size of the original image but I don’t see any difference. Also should hard crop be ticked – please would you explain what hard crop means.

Thanks in advance.

OK Finally got this sorted. My issue was that I was not regenerating the images after I made the changes to the product catalogue image size.

Thanks!