Skip to main content
How to configure buttons in Chameleon?

Learn how to set up buttons to allow users to navigate your Experiences or trigger additional Actions.

Tiago Mota avatar
Written by Tiago Mota
Updated over 3 months ago

Buttons are essential in helping your users take the next action for them to succeed. In Chameleon, you can use buttons to connect Steps in a Tour, or a Microsurvey. As well as configure them to launch other Experiences or additional Actions.


Availability & Usage

πŸ” Available for Startup, Growth, Enterprise

πŸ“ Ready to power your Tours, Tooltips, Embeddables, Microsurveys

βš™οΈ Configure from the Builder


πŸ“Ί See the video below to learn how to configure and use buttons in Chameleon.

This video does not show the latest version of our product. We will soon update all our videos to fit our new style and improvements. 😊


For each Tour, Tooltip, Embeddable, or Microsurvey you create, you can add and configure buttons from the Chameleon Builder's Interactions section. Or by clicking the button directly πŸ˜‰ Here, you can add or remove buttons and access more options.

For any button, you can:

  1. Adjust the style and placement -- text, colors, corners, border width & color, and position on the Step.

    πŸ‘‰ Pick between the bottom left, bottom center, bottom right, or full width position

  2. Configure navigation -- if it should exit, snooze, complete the Step/individual Card, or take the user to a specific Step.

  3. Launch additional Actions - trigger a Chameleon Experience or your connected integrations, send user data, and more. Each button can launch up to 4 actions at a time.

β„Ή With Tooltips, you only have styling, placement, and additional Actions available as they won't have additional Steps or require navigation.

β„Ή You also have a CTA button on any Launcher Welcome State; but in that case, the CTA marks the Welcome State as complete, instead of dismissing it or linking to other Experiences.

πŸ™… Starting with October 2023 the "center-right" button position will no longer be available for new Tours. Existing Tours that leverage this button position will still display and work as expected.

Navigation options

Leverage Chameleon buttons to direct users to the next valuable action users should take or allow them to engage with your guidance later on when they're ready. When configuring your buttons you can leverage a few useful navigation options:

  • Execute no action

  • Available for Tours: the user navigates to a specific Step (you pick which)
    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 via additional Actions.

πŸ’‘ 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.

  • Available for Tours: the user navigates to the next, or previous Step
    If the 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.

β„Ή If you're branching your Tour based on navigation, and also have a secondary button that takes users to the previous Step, this button will always take users to the Step they've previously seen, not the chronologically previous Step in the Tour.

  • Exit the Tour or Card

    Allow users to opt out of your Tour or Embeddable Card by exiting it.

  • Dismiss the Tour or Card
    Allow a user to return to your Tour or Embeddable Card later. Learn more about the different dismiss options.

    πŸ‘‰ Learn more about allowing users to progress, complete, or dismiss your Tours without buttons.

  • Complete the Tour or Embeddable

    Marks the Tour, Banner, or individual Card in a set as completed whenever the button is clicked.

Did this answer your question?