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, Embeddables, Microsurveys, Launchers, Demos
⚙️ Connect it from the Dashboard
📩 Contact us to discuss your plan needs
How does this integration work?
You can leverage HubSpot to refine your targeting, personalize in-app Experiences, and easily connect with your users. 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)
Sync Demo data -- send data to Contact and associated Company records when a Demo is seen
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
Setting up the integration
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 have to toggle on the integration, which enables you to sync your Lists and send Chameleon data back to HubSpot.
Set HubSpot as a data source
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.
Set HubSpot as a data destination
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.
ℹ Hubspot only allows custom events (such as these Chameleon events) to be processed on their Marketing Hub Enterprise plan. If you are not on this Hubspot plan, you will not see these events appear in Hubspot.
To start sending Chameleon data to HubSpot, ensure you 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 your Chameleon events and associated properties within HubSpot under Data Management → Custom Events.
👉 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).
On the Custom Events page, you can review all Chameleon events and select which event properties you want to send to HubSpot for each event.
ℹ This leverages HubSpot's "Custom Behavioral Events" and automatically creates custom properties for your Chameleon event data.
Sync Demo data to HubSpot
👀 Coming soon!
You can enable Chameleon to sync data to your HubSpot account whenever a user sees a Demo. Chameleon will update existing properties or create new properties for Contacts and associated Companies whenever a Demo is seen. Chameleon will send Demo events and any associated Demo tags (that you attach in Chameleon).
On the HubSpot integration page, you can toggle this on, and also restrict Chameleon from creating new Companies if you wish.
How to use it?
The HubSpot integration enables you to connect your adoption efforts to your brand goals to engage users 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 👇
Using my data in Chameleon
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 who 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 to the email sent to Chameleon for each user in your app (either via the Chameleon snippet or via Twilio Segment).
👉 If you want 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.
Analyzing engagement with Chameleon in-apps in HubSpot
📍 Available for Custom Events
If you send your Chameleon events to HubSpot, you can easily review how users perform with your in-app Experiences and better understand users' journeys.
You can review Chameleon events and their associated properties for each contact in your account under "Activities".
On your Custom Events page, you can access the "Analytics" section to see a breakdown of event completions over time. This can help you better understand how many users find value in your guidance and complete your Tours or Microsurveys.
Update properties in your HubSpot Contacts list
According to HubSpot, the option to update properties via their Identify call is deprecated for accounts created after Sept. 2021. (Source).
The following material will only work for accounts this is not deprecated for.
❶ 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 or 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.
Use Chameleon in a HubSpot Workflow
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.
Opening the HubSpot modal in your product
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.
Trigger the HubSpot chat widget
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();
Legacy Integration
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.