Get product variation images on Woocommerce shop page

Question

What I essentially want to achieve is to show product variation images (particular image for each variation) on the shop page. I was successfully able to get the name of the variations using the code below (put into "content-product.php"):

<?php
$colourvalues = get_the_terms( $product->id, 'pa_colour');
  foreach ( $colourvalues as $colourvalue ) {
   echo $colourvalue->name;
  }
?>

Unfortunately there is nothing in the $colouvalues array that is the variations image url or anything related to the image.

Does anyone please help me with this?

Answer 1

You can get a list of the product's variations:

// In the product loop:
$variations = $product->get_available_variations();

// Outside the product loop:
$product = new WC_Product_Variable( $product_id );
$variations = $product->get_available_variations();

Loop over it to get the image from each variation like so:

foreach ( $variations as $variation ) {
    echo $variation['image_src'];
}