How To Track HubSpot Live Chat In Google Ads

Ryan Scollon

Written By Ryan Scollon

Published On 6 Jan, 2023

Google Ads & Hubspot

If you’re using Hubspot for your live chat widget (or have a chatbot running), you might be interested in seeing those leads pull through as conversions into Google Ads. Fortunately, it’s quite easy to set up tracking for Hubspot chat sessions using Google Tag Manager in just a few steps.

What You Will Need:

You will need edit access to Google analytics and publish access in Google Tag Manager. You will also need a Hubspot chatflow setup on the website (live chat or chatbot both work with these instructions).

  1. Google Analytics
  2. Google Tag Manager
  3. Hubspot Chat on your website

Summary Of Steps

  1. Create Event Variables
  2. Create a custom HTML tag for the chat listener
  3. Create a GTM trigger that fires on Hubspot chat engagement
  4. Create the Google Ads event in Tag Manager

 

In this step, we will create 3 new Data layer variables.

  1. Go to variables in your GTM container
  2. Under ‘User-Defined Variables’ click ‘New’
  3. Select ‘Data Layer Variable’ > Name it eventCategory > under ‘Data Layer Variable Name’ enter eventCategory > Save
  4. Select ‘Data Layer Variable’ > Name it eventAction > under ‘Data Layer Variable Name’ enter eventAction > Save
  5. Select ‘Data Layer Variable’ > Name it eventLabel > under ‘Data Layer Variable Name’ enter eventLabel > Save

It should now look like this:

Tag Manager settings

 

  1. Create a new tag in GTM and name it HS Live Chat Listener
  2. Under Tag Configuration, select Custom HTML
  3. Paste the code below
  4. Set the trigger to fire on all pages
  5. Save your tag

<script>
function onConversationsAPIReady() {
window.HubSpotConversations.on(‘contactAssociated’, function(payload) {
window.dataLayer.push({
‘event’: ‘ga_event’,
‘eventCategory’: ‘hubspot-chat’,
‘eventAction’: ‘contact associated’,
‘eventLabel’: ”
})
});
window.HubSpotConversations.on(‘conversationStarted’, function(payload) {
window.dataLayer.push({
‘event’: ‘ga_event’,
‘eventCategory’: ‘hubspot-chat’,
‘eventAction’: ‘conversation started’,
‘eventLabel’: payload.conversation.conversationId
})
});
}
if (window.HubSpotConversations) {
onConversationsAPIReady();
} else {
window.hsConversationsOnReady = [onConversationsAPIReady];
}
</script>

 

Your tag should look like this:

Tag Manager settings

 

  1. Create a new Trigger in Google Tag Manager and name it Hubspot — Chat — Contact Associated
  2. Under Trigger Type, select ‘Custom Event’
  3. In the Event Name field, enter: ga_event
  4. Under ‘This trigger fires on’, select ‘Some Custom Events
  5. Select eventCategory from the dropdown > select contains > enter: hubspot-chat
  6. Click the plus sign to add an extra condition
  7. Select eventAction from the dropdown > select contains > enter: contact associated

Your trigger in GTM should look like this:

Tag Manager settings

 

  1. Go to tags > new > Google Ads Conversion Tracking
  2. Enter your Conversion ID & Conversion Label (through setting up a conversion in Google Ads)
  3. Under ‘Triggering’ add the Hubspot — Chat — Contact Associated trigger we created in the last step
  4. Click Save

Here is what your Google Ads tag should look like:

Tag Manager settings

 

That should be all of your steps complete. Now you just need to wait for a user to interact with your Hubspot Live Chat in order for it to fire a conversion in Google Ads. If you are familiar with Google Tag Manager, you can easily set up something identical if you wish to fire events into Google Analytics. You’ll just need to swap to a Google Analytics Event tag in step 4 and configure accordingly. If you get stuck or have any questions, feel free to reach out.

PPC Audit Service

Ryan Scollon

Freelance PPC Consultant

Ryan has been helping brands grow their business through PPC since 2013. You can often find his insight featured in publications like The Independent, SEMrush, Search Engine Roundtable & many more.

Connect with Ryan on Twitter and LinkedIn