Tracking HubSpot Forms with Google Tag Manager

William Julian-Vicary

Strategy & Innovation Director


Photo Credit: Mathyas Kurmann

 

Difficulty: 3/5
Requirements: Google Analytics, Google Tag Manager
Updated: 12/02/2020
Changes: Added in a an extra guide on utilising Data Imports in GA.

Tracking Hubspot forms within Hubspot's own system might suffice for some scenarios. For most, it lacks context. Where did they arrive from? Did they engage with other pages, events or goals? We can enable this by passing Hubspot form submissions into Google Analytics as Events.

When a Hubspot form has been successfully submitted, Hubspot fires an event that we can listen to and use to trigger marketing tags within Google Tag Manager. Below we create a Custom HTML Tag that listens for a form success, trigger a dataLayer event which can then be used to trigger a marketing tag to push this data into Google Analytics.

First, create a Custom HTML Tag, name it something appropriate (SCRIPT - HubSpot Form Listener or similar) and add an "All Pages" trigger to the page with the script below as the tag HTML:

Here's the code:

<script type="text/javascript">
  window.addEventListener("message", function(event) {
    if(event.data.type === 'hsFormCallback' && event.data.eventName === 'onFormSubmitted') {
      window.dataLayer.push({
        'event': 'hubspot-form-success',
        'hs-form-guid': event.data.id
      });
    }
  });
</script>

Next, create a variable to read the hs-form-guid property (at this time, the HubSpot event does not expose the form name):

Create a new trigger for the Data Layer event triggered by the event listener:

Finally, create a new tag that uses the new trigger and HubSpot Form GUID, to send this data to Google Analytics:

Create a Goal in Google Analytics

If form submissions are a measure of success for you, we recommend creating a GA Goal which counts form submissions against user sessions. This is great for many reasons but mainly because you can use it to determine a Form Submission Rate % and plot that against any campaigns you're running which are aiming for form submissions as a conversion point.

To add a new goal to a GA view, go to Admin > Goals

Click on  to open up the Goal Setup menu

 

Goal Settings

Goal Type: Custom
Goal Name: Macro: Form Submission
Type: Event
Category: Form
Actino: Submit
Label: <leave empty>
Use the Event value as the Goal Value for the conversion: For this setting, it depends on the form's purpose. If a signup means you're going to make a static amount of revenue eg. £120, set this to NO and enter your static value. Otherwise, leave this as YES

Now save your goal. This will begin to collect conversions as the form submissions occur.

Give your Hubspot Forms Human-friendly Names (Optional)

The Hubspot Form GUID's are useless without context - we can help out here by adding in a human-friendly names against them. To do apply friendly form names to your data, head over to Google Analytics > Admin > Custom Definitions > Custom Dimensions

Create 2 new hit-scoped dimensions:

  1. Hubspot Form GUID - remember the Index number for this one
  2. Hubspot Form Name

Head over to GTM where you've created your Hubspot Form event. Enable overriding settings in the Event tag and add in a new custom dimension row with the index you noted down earlier. Ours is 10 but yours will differ. In the right-hand field named Dimension Value you need to add your Hubspot Form GUID variable from earlier. Click the little logo with a + sign on it to find it.

The end result will look like this:

 

Analytics Data Import

The next step is to use Google Analytics data import functionality to associate horrible looking form IDs with human friendly names.

Head over to GA > Admin > Data Import (bottom of the Property Column) > Click Create

Data Set type

Type: Custom Data

Data Set Details

Name: Hubspot Form Names
Select Views: Tick the views you wish to use this data in

Data Set schema

Key: Hubspot Form GUID
Imported Data: Hubspot Form Name
Overwrite hit data: Yes

Save this Import and then click Get Schema > Download schema template

Open the downloaded file in Excel or similar and you should see a very basic 2 column sheet. The column names will look a bit odd as they are going to tell Google Analytics which Custom Dimension Index numbers you're importing data into. Col A is the Form GUID and Col B is your new friendly name/s.

Once you have something similar, save the file. Go back into the Data Import menu in GA and click "Manage uploads" on your new import configuration
Note: You may only have one row which is fine. You might have 100...

Click "Upload File" and then "Choose files" to select the spreadsheet you've just saved. Once added, hit "Upload"

At this point, Google Analytics will import your file and check it for errors. Parsing usually takes less than a minute and it will let you know if there's an issue. Sometimes an empty row can cause issues but it's fairly easy to fix any problems. The end result will look something like this.

So with this imported, we can build a basic report in GA under Custom Reports to check things are working as expected (provided you have data)
We recommend to leave this part for a couple of days until you know you've got data to report on.

When we run this report, we get some pretty helpful data! You'll notice we haven't even included the Hubspot Form GUID dimension because GA is associating this behind the scenes.

 

We could start to mix in other contextual dimensions like Source / Medium or Campaign to understand how people arrive onsite and experiment with how this data is displayed.

Q: I imported the names but no data is showing when it should be

1: GA can sometimes take up to 24 hours to propagate changes to the data. It took 3 hours for it to show for us when making this tutorial
2: Have you enabled this data import on the view you're looking at? Check the data import configuration
3: Are you sure you have data? If you only just implemented the Custom Dimension for GUID, unless you have high volume for submissions, give it 24 hours for collect some data
4: This change will not affect legacy data even if you have GUIDs stored prior to using the Data Import tool

We hope this guide gives you more context around the users filling in these forms. Any issues, drop us a comment below.

 

Related Posts

Extracting Query Parameters in Google Analytics - Free Tool

Auditing your Google Analytics account for query parameters can be tedious but helps keep page reports clear of unwanted row duplication. We talk about the effects of collecting unwanted queries on your reporting and how to fix it. We’ve also built a free tool to make the process easier.


3 months ago

How to get Service Provider back in Google Analytics

Service Provider and Network Domain dimensions are no more. Let’s get Service Provider data back online. We’ll show you how to re-enable ISP data using Google Tag Manager and an IP Lookup Service.


4 months ago

Measuring Content Engagement in Google Analytics - Part 3: Social Site Exits

Track when users leave your site to visit your social media pages. Understand when your content is driving positive move to your social assets.


5 months ago

Measuring Content Engagement in Google Analytics - Part 2: Social Share Click Tracking

The use of social sharing widgets is commonplace. But who’s actually tracking interactions with these? Let’s make a count of how many people are clicking these buttons and record a social share rate to see how many readers amplify content on social media.


7 months ago

DoubleClick Floodlight Tags and Google Tag Manager - Lean up Your Containers

Anybody who uses DoubleClick Floodlight knows the slow process of implementing a new tag for each activity for a campaign interaction or conversion. If you’re using Google Tag Manager to add a tag, trigger and maybe some new variables for every new Floodlight – it won’t take long for your container to overfill with almost identical tags. While there’s nothing wrong with this style of implementation, there is another way.


7 months ago

Measuring Content Engagement in Google Analytics - Part 1: Article Completion Rate

It’s time to ditch bounce rates and average time on page in place of meaningful and measurable insights. Enhance how you measure content engagement with these advanced tracking methods to gain real insights into your content and its value against your business objectives.


7 months ago

Drag