Hubspot | How do I track meeting confirmations with Google Tag Manager?

Introduction & Purpose

This guide is for anyone who would like use Google Tag Manager (GTM) to track user interactions with embedded HubSpot meeting widgets, especially appointment confirmations.

Since our HubSpot scheduling widgets are embedded via iframes, we will create an event listener in Google Tag Manager and and event to the data layer. Then, we will create a trigger based on that data layer event and use that trigger to fire the required tag(s).

Difficulty:

No developer required.

Step 1/2: Create HubSpot Listener & Push Message Data to the Data Layer

The purpose of the tag below is to listen for HubSpot messages regarding user interactions with forms, including our scheduling widget. The tag will log message data to the console and also push it to the dataLayer for GTM consumption.

Copy/paste the code below into a new Custom HTML Tag called "HubSpot Message Listener".

<script>
window.addEventListener('message', function(event) {
  console.log("HubSpot Message Listening to Origin: " + event.origin);
  console.log(event.data);

  if (event.data.meetingBookSucceeded) {
    window.dataLayer.push({
      'event' : 'hubspot_meetingBookSucceeded',
      'event_origin' : event.origin,
      'data' : event.data
    });                      
  }
});
</script>

Trigger - Set the trigger to All Pages - DOM Ready to listen for HubSpot messages on all pages. This trigger may be customized if you only want to listen to specific pages. 

Step 2/2: Trigger Tag(s) Based on Data Layer Values

Create a Custom Event trigger based on the value pushed to the data layer from the Listener in the previous step ("hubspot_meetingBookSucceeded"). 

Add this trigger to an tag(s) you would like to fire when a meeting is scheduled through HubSpot. 

Validation

With the above changes staged in your workspace, Preview you implementation using Tag Assistant. 

Schedule a meeting through the HubSpot widget to ensure that the tag(s) with the trigger (Step 2) fire when expected.