-
Posts
-
Hi there,
Can you please help fix our Woocommerce Product Grid which is displaying different sized images ?
For example one product image is actually displaying smaller than another product, despite having a larger image size.
I have provided more info in the private tab.
Thanks in advance !
Hey humboldt,
You can check this post on how to fix the problems you have with images and how to fix it: https://docs.woocommerce.com/document/using-the-appropriate-product-image-dimensions/
On those tall images, kindly upload images more than 450px in height and width. Hope this helps.
Best regards,
NikkoHi Nikko, thanks for that.
But the problem is that the images are being cropped, and being cropped to different display sizes.
The “Close Your Eyes…” image is 520×810 but displays 333×335.
The “Meditation…Searching for ….” image is 325×449 but displays 333×462.Why is the bigger image “Close Your Eyes…” being cropped to a smaller display size than the smaller image “Meditation…Searching for ….”?
We need them to display at the same dimensions on the Product Grid page .
Thanks, H
Hey!
Can you try to use set Catalog Images and Single Product Images to 325px x 325px, Save it and run Regenerate Thumbnails? 334 x 334px appearing is actually scaled down from 450 x 450px that has been set (if you hover on it you should see Natural 450 x 450), as for the longer image you should see the natural size is 325 x 450px but since the image is being stretch in width to fill in the full width, and the height is also increased as a result to preserve the ratio of the image.
Cheers!
NikkoHi there,
Sorry I thought this was resolved, but it isn’t.
I have followed the instructions above, and the images still display in different sizes.
Cache was cleared, and I have tried multiple browsers
One specific example is I have cloned a product that has exactly the same image, but the 2 products appear as different sizes !
( Beyond the SuperConscious Mind )
Please advise.
Thanks !Hi,
They don’t have the same size because the title of the other product is longer. Try to add a minimum height to the product header container.
#top .inner_product_header { min-height: 119px; }Adjust the value as necessary.
Best regards,
IsmaelHi, thanks for that.
But if you look at http://anandamarga.org.au/store/?product_order=date
the containers are still different sizes, even if the titles are the same number of lines.The same applies with Related Products: http://anandamarga.org.au/product/beyond-the-superconscious-mind-clone-test/
Please advise, thanks !
Hi,
The products “Beyond The Superconscious Mind” and “Meditation: Searching for the Real You” have the same height because the size of the product images are the same and the title have two lines. The product “Close Your Eyes & Open Your Mind” is taller because the product image size is different from the first two products mentioned previously. The “Testing” product’s title is shorter than the other, which is why it’s shorter compare to the others. Please make sure that the product image sizes are the same and then use the css code above.
Best regards,
Ismael
- You must be logged in to reply to this topic.