Buttons are extremely powerful in helping your users take the right next action for them to succeed.
Within any Tour Step, Tooltip, or Microsurvey button you can leverage buttons to trigger actions, such as moving the user to the next Step, dismissing or snoozing the Experience, navigating to a different page, opening another integration (e.g. Calendly modal), running custom code etc.
More specifically, for any button you can:
Adjust the design (e.g. text, style, position etc.)
Select how it links to other steps in the same Experience (e.g. move the user to the next or previous Tour Step)
Enable an additional action (e.g. redirect URL, fire a click, run code etc.)
You can add/adjust buttons by using the Control Panel for an Experience, within the Chameleon Builder, or by directly clicking the button to edit it.
You can configure the styling of the Buttons easily after selecting that component:
Each button can be set to either:
Execute no progression action
Move the user to the next step
If the next step of your Tour appears on a different URL, you can either let the user navigate manually to that page, or configure a URL redirect from the Additional action option.
Instead of redirecting, consider prompting the user to manually navigate (take action to reach the new URL). This will help the user internalize what you are showing/teaching more quickly.
Move the user to the previous step
If the previous step is on a different URL, the step will automatically redirect to that URL, as long as the URL set of the previous step is "loadable" and does not contain wildcards or a regex.
Dismiss the Tour
You can use this to allow a user to opt-out of this Tour, either by exiting or snoozing it.
👉 Understand the different dismiss options
One of the most powerful aspects of Chameleon is the ability of the button to launch one of a range of actions. You can configure these from the Additional actions option.
Set a URL to load when a user clicks the button (it can be configured to open in a new tab)
Note: the step will only show if it matches the current URL. If a subsequent Step's URL trigger does not match the redirect based on this action, that Step will not show.
You can also use a "mailto" link to open the user's email client with an address pre-populated (for example
Click Element: an element on the page can be automatically clicked when a user hits the "Next" button. Great for redirecting users without using URLs. Learn more about how Chameleon identifies elements.
Start Tour: directly begin another Chameleon Tour. This means you can string together different Tours. Only Live and Manual Delivery Tours are available to select here. Any Trigger conditions for the first step of the Tour (e.g. click a button) will be ignored here.
Start Microsurvey: show a Chameleon Microsurvey from the button, to collect feedback. Any Trigger conditions for the Microsurvey (e.g. click an icon) will be ignored in this instance.
Calendly scheduler: show a Calendly modal to help users schedule a call. Read more in our Calendly integration guide.
Delighted NPS: show a Delighted NPS Microsurvey to collect feedback from users. Read more in our Delighted integration guide.
Intercom messenger: open the Intercom messenger window with a pre-filled message to help users start a conversation. Read more in our Intercom integration guide.
Typeform Microsurvey: show a Typeform to collect user responses to a microsurvey. Read more in our Typeform integration guide.
Note: Some of these integration add-ons (Calendly, Delighted, Intercom, Typeform, Custom JS) are only available on certain advanced plans. If you're interested in using these, feel free to let us know.
It's also possible to determine click-based actions for users to progress or dismiss the Tour, without making use of buttons. These can be added from the panels under Interactions in the Control Panel. The current options are:
Click to complete, Click to progress
This option allows the user to click somewhere to progress to the next step. The clicking options available here will depend on how the step is positioned and whether there's any shroud or lightbox. The existing options are:
Anywhere outside the Step
Specific element (available when the Step is positioned relative to the screen and there is no shroud)
Inside the lightbox (available when the Step is positioned relative to an element and there's a lightbox)
Click to dismiss
This option allows the user to click anywhere outside the step to dismiss the Tour, either by exiting or snoozing it.
These configurations provide you a wealth of options to help a user interact with and learn the interface within your product.
👉 Have any questions? Let us know how we can help.