Show images from product variants

Hello. I have been searching for help with this but I can’t see anything. Sorry if I have missed a thread on it.

On a product page the main image changes when you change the variant, based on the image loaded for that variant.

I have created an enlarged image to show when you click on the product image. Nothing exciting but allows the user to see the product image full screen.

What I can’t do is get the enlarged image to show the variant image selected. It just shows the product default image.

How can I pull the variant images?

Example shorturl.at/vAKOQ

So if you change the variant to red and click it, when it expands you get the default grey show. How do I get that to show the variant colour? I don’t mind if you have to scroll through all the variants colours on the expanded view. I just can’t find any way to pull those variant images. Each variant just has one image.

Any help would be great. Thanks


Can you share your read only link? I’ve read similar questions to yours, and it may be the case that in your navigator, you aren’t using the “add to cart” element, and instead, just div wrappers and form elements?

Add to cart elements will link to the options and images for each product, so long as there are images for them.