Catalog images with the same size
I have some products in my catalog that are imported by the supplier and have predefined images, which I can't change. But in the catalog view they appear different from the others, they appear larger and/or cropped, as you can see in the Print.
In the theme settings I've already set the size limit for the images, but they remain unchanged and I've tried using CSS codes but with no success.
I want the catalog images to all appear at the same size (800px vs 800px) regardless of the image uploaded.
Can you help me?
Comments
Hi,
Please always attach a link to your website so we can check it out. If the page is offline(localhost), then our help will be limited. You will have to contact us when the page is online. Also, please make sure that the page is not under maintenance before you provide us with the link.
It is always a good idea to also attach a screenshot showing your issue.
Thanks
I'm sorry, but I had the screenshot and didn't attach it, so here it is.
Can you please attach a link to the website as well?
Thanks
It's this one: http://ps5digital.pt/
Did you try using an option to regenerate thumbnails in Betheme -> Tools?
Best regards
Yes, I let it run at 100% and it didn't work. And in the meantime I had to put the site into maintenance mode because it can't stay visible for long. But you have ADMIN access to the website, which is still active.
It is due to image aspect ratio. See the following example:
Because it has a different ratio than other images, and in Appearance -> Customize -> WooCommerce, and you have set cropping to 1:1, then some images will be cut/or behave incorrectly.
What you can try to do is to change the cropping to, e.g., 9x16 (so it will have a ratio as the box), and in theme options, change the image width to, e.g., 400 (so if the image is smaller than 800px like in the screenshot above it will be cut properly).
Remember to regenerate thumbnails after all.
Best regards
Lately the "Regenerate Thumbnails" option is stuck at 40% for several hours without moving. Do you know what it might be?
I'm sorry, but I tested the way you told me to, and it didn't work. :(
Not all images are loaded by me; they come from an external provider, and I have no control over the images they load, and all images loaded by them have different sizes.
Is there a way, using HTML or CSS code, to ensure that all images are displayed within a "square" with specific dimensions, without cropping, only by setting a maximum height of 800px (for example)? I'm not sure if I made myself clear.
Instead, try using the Force Regenerate Thumbnails plugin. You can find it and install it through Betheme -> Plugins.
You must change the WooCommerce cropping because, without it, the images that do not fit will be cropped as they are now, and no CSS can correct this.
Best regards