Get URL of Thumbnails of Images in WooCommerce

Question

I use the following code to capture an image of each option for a particular product:

$product = new WC_Product_Variable( $product_id );
$variations = $product->get_available_variations();

foreach ( $variations as $variation ) {
  echo "<img src=" . $variation['image']['url'] .">";
}

This returns a full size image.

Can someone tell me how I would change this to return the sketch url? (or any other size)

I'm sure these are pretty simple changes, but I just can't figure it out.

Answer 1

Use thumb_src instead of url.

$product = new WC_Product_Variable( $product_id );
$variations = $product->get_available_variations();

foreach ( $variations as $variation ) {
  echo "<img src=" . $variation['image']['thumb_src'] .">";
}

Answer 2

If you know the product change identifier, you can do

// find out $variation_id, it different from product_id
$variation = new WC_Product_Variation( $variation_id );
$image_tag = $variation->get_image();

// The below is the whole image tag including <img> and some classes that will help customize it.
echo $image_tag;

. , Woocommerce WC_product_variation, WC_Product. get_image() WC_Product, .