You can trigger specific actions based on the values provided by your visitors when they interact with your survey. Conditional logic allows you to show or hide survey elements or screens depending on each user’s input.
Show or hide an element based on a visitor’s survey response
You can configure elements or screens to appear (or disappear) based on what users select or type in your survey elements. For example, if a visitor selects a specific answer in a multiple choice question, a Long Answer field may appear to ask for more details.
To do this, you create:
- Element 1, visible by default
- Element 2, hidden by default
- A conditional rule in the Events section to display Element 2 if a specific value is selected in Element 1.
Example use case
Let’s say you’ve built a multi-step NPS survey and want to customize the experience based on the user’s score. For example, if a user gives a score from 0 to 6 (a Detractor), you might want to display a follow-up question asking for more feedback. If the score is 9 or 10 (a Promoter), you can skip straight to a thank-you message.
In this example, the survey consists of three screens:
- Screen 1: the NPS score question (0–10)
- Screen 2: an open text field asking for the main reason behind the score
- Screen 3: a confirmation screen (“Thank you for your feedback!”)
Step 1: Set up your survey screens
In the Widget Studio, create each screen:
- Screen 1 with the NPS element
- Screen 2 with a Long Answer (textarea) field and a submit button
- Screen 3 with a confirmation message
Make sure only Screen 1 is visible by default.
Step 2: Add a conditional logic event for Detractors
Go to the Events panel and click Add event.
As the trigger, select Survey/Form.
Choose By element survey/form value.
Click on Select an element and pick every score between 1 and 6.
Then, define the action. Click on Add action > Show element.
Select Screen 2.
This means that Screen 2 will only appear if the visitor selected a score between 1 and 6.
Step 3: Add a conditional logic event for Passives and Promoters
To customize the behavior of your widget when users select higher ratings (e.g., 7–10), click Add event again and follow the same steps for every score between 7 and 10. Set the action to Show element → Screen 3 and Hide element → Screen 2.
This means that Screen 3 will appear directly if the visitor selected a score between 7 and 10.
This ensures a smooth transition from the feedback step to the thank-you screen.
Step 4: Simulate your widget
Here’s what the final logic looks like:
- Screen 1 is always shown first.
- If the score is between 0–6, Screen 2 is shown next.
- When the visitor clicks the button on Screen 2, they reach Screen 3.
- For scores 7+, Screen 2 is skipped and users go directly to Screen 3.
This logic helps you gather more detailed insights from detractors while keeping the experience frictionless for other users.
