Woocommerce Single Image Size

Hi There

I have some pages where I just want to use single images at the bottom of the page just to highlight products pertaining to the page content.

At the moment the images are quite large and I would like to be able to control the size of the actual images. For the single produce I am putting [products ids=“215594, 215601”] for instance and this brings up the correct image etc. Its just that they are far too big.

I have looked through the knowledgebase and cannot find anything so hoping there is a way to make these smaller.

Many thanks.

Hi There,

Thanks for writing in! Could you please try adding the following CSS rule into your Theme Options > Global CSS area and see if that helps.

.size-shop_catalog.wp-post-image {
    min-width: 50% !important;
}

Hope that helps.

Hi Mldarshana

That worked great for the image but the box outline ie the lines border around the image is still 100%. Is there something I can put in to make this the same size as image.

Also on the shop page the border now has an odd size and is about 25% bigger than the image.

Is it possible on the shop page - now the images are smaller to get 5 or 6 to a line as well.

Many thanks.

Hi there,

Hmm, perhaps you wish to limit it with the actual pixel value instead of percentage? Because if you’ll resize the bounding box to 50% then that means half the width of page content. While the above CSS means half of the bounding box, which is small. Example, please remove the above CSS and add this

@media ( min-width: 980px ) {
.page-id-215551 .woocommerce li.product {
    width: 22% !important;
}
}

This shouldn’t affect your shop page due to .page-id-215551 selector. What do you mean by 5 to 6 lines? You mean per row?

Thanks!

H there

Sorry I meant 5 or 6 products per row but actually the images are pretty perfect now with your new code except that I have several pages with single products so just putting one page in the css wont work so I guess it needs to apply to all single images even the ones on the shop page.

I took out the page id and it all seems to be ok and I prob will not need 5 or 6 products per row but it would be great to know how to do it.

Kind regards

Glad it works now :slight_smile: Cheers!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.