Go to the Appearance > Customize > WooCommerce tab and make sure the image settings are configured to your liking.
Hi Caleb,
Thank you for your assistance!
I have made adjustments but do not seem to be able to resolve the padding between product images in the second row i.e. the first and second images on the second row have no space between them.
I would appreciate any ideas on how to resolve this?
Thank you.
Tim 🙂
You have a line somewhere in your theme’s stylesheet that is causing this.
.woocommerce .upsells.products ul li.product:nth-child(4), .woocommerce-page ul.products li.product:nth-child(4) {
margin-right: 0;
}
You need to remove the .woocommerce-page ul.products li.product:nth-child(4) part otherwise it will take effect on all product images that are displayed 4th.
Hi Gerhard,
Thank you for your expertise. I forwarded your comments to Themeisle. Below is their response:
Hi Tim,
Thank you for contacting us! The latest WooCommerce version added some new options, like the option to select the number of products per row on the shop page https://prnt.sc/i85n6n .And the default value for that is 3. Zerif Lite was designed for a number of 4 products per row, and at this moment the code we added for that, makes it not look the best with 3 products per row. But we’ll work on fixing this compatibility issue in the next days. Until then, the best solution would be to try to select the 4 products per row option, to be sure everything looks ok on all devices.
And I’ll let you know when everything is ready for every option in WooCommerce.
Thank you for understanding.
🙂
