Image variant as image bg on button

Hi all, I have this design for a product page. I need to put the image of each variant as a background in the option list (button style) as you see in the design. The problem is that when I put the image element inside the button variant, I can’t link the main image of each product variant.

Maybe I need some javascript?

edit: I’ve seen this thread that is related: Outputting Variant images

Thank you!

Here is the page I am working on (Read-Only):

https://preview.webflow.com/preview/prisca-brown?utm_medium=preview_link&utm_source=designer&utm_content=prisca-brown&preview=9b78f9d37d0256b345054d2da0262efc&pageId=6228a02b09439574dc194ef7&itemId=6228a30e8544f318f6ffd963&workflow=preview

1 Like

Ok I found a workaround that maybe could be useful to anybody facing this kind of problem.

I placed on top the grid with the variant buttons totally transparent in any state. On the back I put a collection list linked to a multi-image field viewed as grid. So each variant button would be on top of the corresponding image.

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.