Hello,
First of all, we wanted to explain that the functionality of swatches on the product archive is the same as on the single product page, including variation images, because by default, WooCommerce variations are only available on the single product page. While the main product images in the product archive can be cropped using WooCommerce settings, WooCommerce does not have any options for cropping images from the single product page. As a result, when a variation is selected, it displays the image from the single product page, which cannot be cropped to match the aspect ratio of the images in the product archive due to WooCommerce’s lack of this functionality.
This issue can be resolved in two ways:
1. Use the same aspect ratio for images on both the single product page and the archive. In your case, all images should be uploaded with a square aspect ratio of 1:1.
2. Since you are using a simple aspect ratio, alternatively, you can use the following custom CSS code for the product archive, which will not physically crop the image but will make it appear square using CSS.
.wd-product .attachment-woocommerce_thumbnail img {
aspect-ratio: 1;
object-fit: cover;
}
Best Regards.
.
