Creating a customizable product variant image with checkboxes for attributes
I'd like to create an image of a product that changes based on different attributes that are selected beside it, like how you'd see on an ecommerce product page. It's just a prototype, so I don't need it to have any functionality beyond just allowing someone to customize the image.
For my 2 attribute selections, I have checkboxes with toggle states:
- "Cabinet Colour" selection of White or Black
- "Handle Colour" selection of Silver and Gold
I also have the 4 different images for each unique combination of atributes, which will appear beside the checkboxes.
How do I make the visibility of an image triggered by specific combinations of attributes? The logic would be:
- If the White and Silver boxes are in toggle states, then show visibility of Image 1 White and Silver
- If the White and Gold boxes are in toggle states, then show visibility of Image 2 White and Gold
- If the Black and Silver boxes are in toggle states, then show visibility of Image 3 Black and Silver
- If the Black and Gold boxes are in toggle states, then show visibility of Image 4 Black and Gold
Thanks in advance!
