Find the sizes of the images as they are being displayed by your theme. Check at different viewport widths. Then set those sizes at Dashboard > WooCommerce > Settings > Product tab > Display.
If you check “hard crop”, the images should display the same size, and the layout will look good, but its likely that some useful parts of some images will lost.
Assuming you leave “hard crop” unchecked, what usually happens, depending on your theme, is that the tops of the images line up when in rows, but the images will be of different heights, so the titles and add-to-carts will not be in line.
At this point, you could use some custom css to make the space for the images the same – this will result in white space between the bottom of some images and the titles, but the titles will be in line, or, you could use some custom css to stretch/shrink the images to a set height. This can look strange in my view.
Some themes offer a masonry layout, where all the product blocks vary in height but are slotted together, so in line vertically but not horizontally.
Ultimately, if you have a variety of image aspect ratios, perfection of display is not realistic.
Whenever you change the image size settings, you must run the regenerate thumbnail plugin. Its the thumbnails that are sent to the browser, not the images that you have uploaded.
We have try to above way but image not coming full view how to set full image with in the layout.
Zandy Ring
(@zandyring)
Automattic Happiness Engineer
> image not coming full view how to set full image with in the layout.
This is likely something that’s set by your theme. You may need to make some edits to your theme using CSS to make those appear full-width.
Cheers!
