Skip to main content
Question

Change to Variant# using Overlay, is it possible?

  • August 8, 2024
  • 1 reply
  • 148 views
AFEI

Hi everyone,

Is it possible to change to a variant using an overlay?
I want to reproduce what is happening below, using a variant instead of a page.
The problem is that it seems impossible to link anything from the overlay to the variants.

This is the result I want:
When I click on a color it opens an overlay

image

Then I pick a color and it changes the jersey to another variant.
image

This should be the result with a variant. (It is a new page on this example)
image

The problem I encounter is when I open the overlay with Default Variant, in the overlay, I want to select a color that would trigger the change of Variant. But Figma doesn’t allow me to make that link.

Is there any way to make it work?

This topic has been closed for comments

1 reply

Ellwood
  • Ellwood
  • New Member
  • 8 replies
  • August 8, 2024

I would suggest creating a variable to hold the variant ‘state’ and map your component to use this variable to control what variant is displayed. That way, when you click your options in the overlay you only need to update the variable to the selected variant name.

You could also add some IF statements to map the colour selection matrix to specific variants i.e. if colour1=red && colour2=blue then variant name=“RedBlue”.

Hope that helps.

Terms & ConditionsCookie settings

Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings