Typeform integration user guide

How to set up and use Chameleon's Typeform integration

Chameleon Team avatar
Written by Chameleon Team
Updated over a week ago

With Chameleon's Typeform integration, you can launch Typeform polls from buttons in Chameleon Tours and Microsurveys.

You can allow users to chime in with more feedback or context around a specific feature, blockage, or experience.

Quick access

This integration doesn't require any form of set-up or initial configuration.

To get started embedding Typeform into your Chameleon Experiences, all you need is a live Typeform poll and a Chameleon button to trigger it from.

With this integration, you can configure any button within a product Tour, or a Microsurvey to launch a Typeform once a user clicks it. To do so, select a button and pick Typeform from the Additional actions option.

You will then be able to paste the Typeform URL that you want to launch (by getting the share link from your Typeform) and adjust the positioning of the embed on the page. You can choose to show it as a:

  • Drawer from left

  • Drawer from right

  • Full-screen Popup

  • Side popover

And that's it! πŸ’‘ Use this integration to let your users effortlessly take big-scale polls inside of your product when they are already engaged and in context.

Note: We recommend ensuring the Button that opens the Typeform is configured to 'Complete Microsurvey/Tour' so that the Step is closed and the Tour is marked as completed. Otherwise, the original Step may stay open, or if you set the Button to 'Dismiss Tour' the analytics will reflect that the user exited the Tour.

Typeform allows data to be received via URL parameters. referenced as 'Hidden Fields'.

For example, with a Typeform URL https://tutorials.typeform.com/to/nzthWI, you can append 'Email' as a property by using https://tutorials.typeform.com/to/nzthWI#email=xxxxx where xxxxx is personalized for each user. You can read more about this here.

This way you create a better user experience because your users don't have to manually enter data into the Typeform that you already have about them.

You can leverage this when opening a Typeform from a Chameleon Experience by sending any user attribute data you are already sending to Chameleon, also to Typeform.

To do this simply add the variable for that user attribute, e.g. {{user_email}} as part of the target Typeform link, e.g. https://tutorials.typeform.com/to/nzthWI#email={{user_email}}

πŸ‘‰ Read this article to learn more about using merge tags to personalize content and URLs within Chameleon.

Note: you can see which user attributes are being passed to Chameleon by entering them in the body field of a Step. Once you insert this variable into the Body you will see the actual data for that variable display (for you, as the logged-in user.)

How to prevent a Tour Step from displaying until Typeform is off the screen?

To make sure your product Tours don't interfere with your Typeform polls, you can add an Element Rule using the Typeform in question, to prevent that from happening:

  1. Use Preview mode to display the Typeform in the Builder.

  2. Go back to Edit mode on the Step you want to prevent from showing up.

  3. Select Element Rules from the 'Display Rules' section to add a rule for this Step.

  4. Click "Adjust element" or "Select element" (if you don't have any set) and select the left-side box (dark space) that contains your Typeform using the point-and-click editor. Chameleon will highlight it and you simply click to select it. Confirm it as your defining element for this Rule.

  5. Set the element to be "Absent" - so your Step will not show when this element is present on the page.

  6. Tell Chameleon to start looking for that element 2, or 5 seconds after the page loads, to ensure everything is in place.

  7. Allow the next Step to display as normal. Once your Typeform will be exited, the Step will appear as normal.

πŸ’‘ If it makes sense to your users' flow, you can also skip this Step if the condition you set in the Element Rule is not met.

πŸ‘‰ Have any other questions or concerns? Make sure you know how to best get help!

Know more

Did this answer your question?