HubSpot integration: user guide

Learn how to set up and use Chameleon's Hubspot integration

Pulkit Agrawal avatar
Written by Pulkit Agrawal
Updated this week

Make your product guidance part of your team efforts and Experiences an integral part of your growth stack with our HubSpot integration.

Target better messages, enable customers to connect with you directly in your product, and gather data as your users engage with your Experiences.


Availability & Usage

πŸ” Available for Growth & Enterprise

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

βš™οΈ Connect it from the Dashboard

πŸ“© Contact us to discuss your plan needs


Quick access


You can leverage HubSpot to power your Chameleon Experiences and ensure your customers can always reach you where they need to. By connecting your HubSpot account, you will be able to:

  • Set HubSpot as a data source -- get your HubSpot Lists data into Chameleon (for targeting Experiences)

  • Set HubSpot as a data destination -- send Chameleon events to HubSpot (to target and customize your campaigns)

  • Use Chameleon in a Hubspot Workflow -- use HubSpot Static List membership to trigger a Chameleon Experience as a stage in a Workflow.

  • Open the HubSpot chat widget from a Chameleon Experience

  • Open the HubSpot modal in-app using Chameleon


First, head over to the integration page in the Dashboard to connect your account using OAuth. This enables Chameleon to receive data that you can use for targeting.

Once your account is connected, you'll just have to toggle on the integration which enables you to sync your Lists and send Chameleon data back to HubSpot.

Configuring HubSpot as a data source will allow you to leverage your HubSpot Lists to target Chameleon Experiences.

πŸ’‘ HubSpot Lists are dynamic groups of users within HubSpot that can change based on attribute and event conditions. You can, for example, define Lists for new leads from a specific marketing announcement, enterprise trial accounts, etc. πŸ€“

After you connect your HubSpot account, you will be able to select which lists you'd like to leverage in Chameleon by syncing them. You can do this under "Sync with your HubSpot Lists".

Once you have a list synced, it will be displayed on a table from where you can review a group of data about it, namely:

  • When it was last imported.

  • How long it took to import.

  • How many members it contains.

  • The status of the import.

You can also manually sync your list, or stop syncing it altogether and remove it from Chameleon. Once synced, your lists will be available to use as Segmentation filters.

πŸ’‘ This integration uses a "polling" method to check for list membership (roughly every 6 hours) and is more performant with fewer lists. For this reason, we encourage you to only sync the lists that you intend to leverage when targeting Experiences.

Configuring HubSpot as a data destination will allow you to send Chameleon events into your HubSpot account. These events include, but are not limited to:

  • Chameleon Tour Started

  • Chameleon Microsurvey Completed

  • Chameleon Step Seen

  • Chameleon Button Clicked

πŸ’‘ To learn more about the events that Chameleon collects read the article on the analytics that Chameleon provides.

To start sending Chameleon data to HubSpot, you just need to enable the toggle, from the Hubspot integration page in your Dashboard.

Once this is enabled, Chameleon will leverage the HubSpot code snippet loaded on your product's pages to send events from the client-side to your HubSpot account. You can then review these events within HubSpot.

πŸ‘‰ For Chameleon to be able to send data, HubSpot must be installed on the page wherever the Chameleon event took place. To see the right user data in HubSpot, we suggest you ensure that your identifier is not a duplicate (i.e. email and UserID).


The HubSpot integration enables you to connect your adoption efforts to your brand goals to better understand your users and re-engage them efficiently. For example, you can send a follow-up email to someone who dismisses an Experience, or more information to a user who opts in to learn more.

There are different ways you can leverage this integration πŸ‘‡

The Hubspot Lists that you sync with Chameleon can be used when building Segments for your Chameleon Experiences. Simply choose your Hubspot List, and whether to show the Experience to users that are members of that List, or those who are not members.

Chameleon will recognize members of your HubSpot Lists by matching the email field of the users in List to the email that is sent to Chameleon for each user in your app (either via the Chameleon snippet or via Twilio Segment).

πŸ’‘ To use a custom attribute from the HubSpot Contact record to match your Chameleon users contact us and we can help set up the connection.

❢ Set up additional Actions to update existing user properties in your HubSpot Contacts list, for every user who clicks a Chameleon button.

All you have to do is create your properties in HubSpot and define the same ones for your button Actions; you'll see your data updating as users go through your Experiences. You can leverage different properties for each button.

πŸ‘‰ This method is ideal if you want to update one property at a time, for each user who engages with your Experiences.

πŸ’‘ You can also set up specific workflows in your HubSpot account to trigger whenever a property gets updated. This enables your team to engage your users even better.

❷ If you want to update multiple user properties simultaneously, you can leverage the same button Actions, with the Run custom code option. This leverages HubSpot's identification method and allows for more manual control via their API.

To do this, add in the code snippet, including the HubSpot identify method, the user email, and any properties you want to update in your account.

✚ Make sure you also run _hsq.push(['trackPageView']); at the very end of the code -- this is what actually pushes the identify call to HubSpot.

This method enables you to update an existing user, contact, or create a new one (based on the user's email address). If the email exists in your account, the properties you add will be updated; if not, it will create a new entry with that email and the new properties.

✨ You can also leverage merge tags with this option to send dynamic data based on the different users you have. But ensure you use quotes for the value of the property being set.

πŸ“Ί Check out the step-by-step flow in the video below.

HubSpot Workflows are a key way to coordinate your campaigns and adoption efforts as a part of a workflow. This way, you can leverage multi-channel messaging for better engagement and conversion.

To use Chameleon as a stage of a Workflow, use a Workflow stage for adding the Contact to a Static list. Then create a Segment in Chameleon to target the Experience to anyone who is a member of this Contact List.

Chameleon also sends out event properties as part of these events, such as the Experience name, URL, and others (e.g. Step number) where relevant.

For full details of all Chameleon data sent to HubSpot, use our schema below:

You can further leverage these properties in HubSpot filters or reporting, to help you identify specific users and include them in other campaigns down the road.

πŸ‘‰ Learn more about using Custom Behavioral Events in HubSpot.

You can leverage HubSpot to seamlessly connect with your audience by triggering a modal from a Chameleon Experience and allowing users to schedule a meeting directly from your app.

If HubSpot is installed in your app, just ensure you've toggled on the integration from the Dashboard, and you're set to go.

Set an Additional Action to trigger the HubSpot meeting modal to show as soon as your users engage with a button in a Chameleon Experience. Select your button, go to Additional Actions, pick HubSpot, and paste in your scheduling URL.

Now, once a user clicks your button a calendar modal will pop up and they will be able to put some time down on your calendar. Make it count. πŸ˜‰

After the HubSpot modal is launched, users must manually close this, so be careful if you have other Steps appearing after this.

πŸ’‘ You can use this Typeform troubleshooting method to prevent a Tour Step to display until your HubSpot modal is off the screen; or use Step triggers to require the user to take another action (such as a click on a specific element in your product) before showing the next Step.

This enables users to schedule calls with you, at their convenience. Here are some ideas:

  • Get feedback on a new feature or beta test.

  • Offer a customer success webinar to help users learn more about your product.

  • Get feedback when users need more help figuring things out.

You can also use your Chameleon Experiences to connect with HubSpot and trigger the chat widget directly from your Tours, Microsurveys, or Launchers.
​
Run a custom code script to call the HubSpot Conversations API and open the chat widget, by using the following code:

window.HubSpotConversations.widget.open();


The details outlined below refer to a deprecated version of the Hubspot integration. It will only be relevant if you have been using the existing Hubspot integration prior to 2021. We strongly encourage you to switch to the newer version of the integration (outlined above) which includes the following key benefits:

  • More frequent syncing (every 6 hours, instead of every 24 hours)

  • Clearer information about which lists have been synced and when

  • Easier configuration and management, via the Chameleon dashboard

After 1 March 2021, we will automatically transition all remaining filters to use the new integration and remove this integration from the Chameleon product.


Find out more...

Did this answer your question?