To remove product image cropping from product listing pages in WooCommerce, you can add the following code to your theme’s functions.php file:
add_filter( 'single_product_archive_thumbnail_size', 'remove_product_image_cropping' );
function remove_product_image_cropping() {
return 'full';
}
This code uses the add_filter
function to hook into the single_product_archive_thumbnail_size
filter, which controls the size of the product images on listing pages. The remove_product_image_cropping
function that we define simply returns the string ‘full’, which tells WooCommerce to use the full size of the image instead of cropping it.
You can also use CSS to control the image size.
.woocommerce ul.products li.product a img {
height: auto;
width: 100%;
}
This code will make the image to take the full width of the container and adjust the height accordingly.
Last modified: January 30, 2023