[Support request] Woocommerce product image size.

[trigerty]

Hello. i’ve been trying to set products image sizes in WooCommerce. Been trying to set it in appearance/ WC/ – no changes.
Product image resizes with page size and always stays large. Also image blocks visible left part of the text, seems to be some css conflict. Even if i set image size 56 px – woocommerce enlarges it to fill the page but shows it small when clicking on image
Printscreens:
https://prnt.sc/refv2q
https://prnt.sc/refxp9

I would like to be able to set sizes as i want to and to have no image\text border conflict.
Thank you.

[Tom]

Hi there,

What happens if you reduce your Product Image Area Width option in Customize > Layout > WooCommerce?

Let me know 🙂

[trigerty]

Product image area reduced like i wanted to. (desktop version) And i’ve spent hours messing around with those pictures..
I didn’t find option for setting mobile version picture width so it remained the same. Is it possible to change it?
https://prnt.sc/renkua

[David]

Hi there,

you can use some CSS like so:

@media (max-width: 768px) {
    .woocommerce div.product div.images img {
        max-width: 250px;
        margin: auto;
    }
}

[trigerty]

it works!

[David]

Glad we could be of help

[DAVID]

This is an excellent solution. Have had to add it to all my Woocommerce sites so think there is probably a case for adding a mobile width selection to product image width in the Generatepress customizer settings.

[David]

Glad to hear that.
Yeah woo images can be a pain – we’re looking at Woo features for a future update so we’ll keep this in mind.

[Author]

Posts