This post is inspired by the excellent Drip + GTM setup video from Julian Juenemann of GTMTraining.com.

Using Google Tag Manager with Drip makes it much easier to start tracking custom Drip events.

GTM lets you track how people are interacting with your site, and send your visitors’ clicks as Events to Drip – allowing you to get API-level integration without having to sling (very much) code.

What you need to make this happen:

  • A Google Tag Manager account
  • A Drip account
  • A website or web app

If you aren’t taking advantage of event-driven emails in Drip, Google Tag Manager gives you a nice onramp without too much of a learning curve. What are you waiting for? Time to become Superman. Let’s get started.

Set Up A Google Tag Manager account

If you’re already using the tool, bypass this step, otherwise, you’ll want to first set up a GTM account. Do it here. If you’re unfamiliar with Google Tag Manager, here’s an overview provided by Google.

Once you’re in, you’ll be shown a snippet of JavaScript.

If you’ve used tracking in any way before, this isn’t unfamiliar. The good news is, once you place this snippet on your site, you can say sayonara to manually placing tracking snippets on your pages from here on out.

Now, let’s take a look at using Drip with Google Tag Manager.

Deploy Drip’s JavaScript Snippet With GTM

If you haven’t yet placed your Drip JavaScript snippet on your site, you can use Google Tag Manager for this. Grab your Drip tracking snippet from your Drip account (find this under Settings > Account > Site Setup).

Now, in Google Tag Manager, click “New Tag.”

Add a name to your tag (“Drip JavaScript” is a good one).

Click the “Tag Configuration” module and select “Custom HTML.”gtm-1

Copy and paste your JavaScript tracking snippet located in your Drip account (Settings > Account > Site Setup).

Click on the “Triggering” module.gtm-2

Select “All Pages” and click the blue “Save” button located in the upper right-hand corner of the tag configuration.gtm-3

Next, go ahead and publish your tag.gtm-4

Now that your tag is published, let’s make sure it is active on your website. Navigate back to your Google Tag Manager “Workspace” and select “Preview and Debug.”gtm-5

When you reload your web page, Look for the Google Tag Manager Debug Console. This console will appear on any web page that you have installed/published your Google Tag Manager snippet.gtm-6

See that console pop up? High five. You’re using GTM to deploy your Drip JavaScript tracking snippet and you’re ready to start tracking events.

In order to test properly, you’ll need to submit an email address to Drip through an opt-in widget. This way, Drip will track your test actions and associate them with your test subscriber record.

Tracking Events: Laying The Groundwork

You can use Google Tag Manager (GTM) to send events to Drip. Sending events to Drip will allow you to fire your automation sequences using Workflows or Basic Rules. To do this, we will use Drip’s JavaScript API, calling the “track” method.

Learn more about Drip’s JavaScript API.

Here’s the API call we will be using:

<script>_dcq.push([“track”, “My Event”, {myProp: "My property"}]);</script>

Now, let’s add a new GTM tag using the API snippet.

Click “New Tag” in the GTM interface under Workspace > New Tag:

Then, click to configure the tag and select “Custom HTML” as the tag type:

Give the tag a descriptive name. For this example, we’ll name the tag “My Event”, but this name is arbitrary and you should choose a more descriptive name for your event. Then, copy and paste the JavaScript snippet from above and change the name of the event and add any properties you’d like. It’s recommended to name the event the same name as the tag to keep things concise, then click “Save”:

Now that we have added the snippet to the tag, we must now create the trigger event to fire the tag and send the event over to Drip.

To do this, click on the “Triggering” module of the tag setup:

Click the “+” icon to add a new trigger:

For this example, we will setup a click event to fire off our tag. Select “All Elements” under the “Click” heading for this trigger:

Keep in mind that this is just one example of how to setup a trigger.

For this trigger event, we will select “All Clicks” to learn how this works. In the end, you may only want your tag to fire when a user clicks something specific on your website, such as a call to action button, for example. If that’s the case, you would select “Some Clicks” and use the built-in options GTM gives you to set this up.

We now have a new tag and trigger ready to go. Don’t forget to save your settings!

 

Previewing your new tag

Let’s preview our tag activity in the GTM console to make sure our tag is firing correctly.

Click the “PREVIEW” button in the upper right-hand corner of the GTM interface:

You should then get this success message:

 

Go to your website and refresh the page. If the GTM preview mode is not already open, you can click the “Debug” icon located in the lower right-hand corner of the browser window:

Because our tag is configured to fire on “All Clicks”, this means you can click anywhere on your site to fire the tag. Once you click anywhere on your site, you will see an event called “gtm.click” under the summary sidebar in the GTM preview console. Select that click event and you should see your event under the “Tags Fired On This Event” heading:

 

As long as you see that tag under the “Tags Fired On This Event” heading, your tag is ready to go. Once that is working, all we have to do now is submit our changes so that this will still work once we exit preview mode.

 

Submit your GTM changes

It’s important that you remember to submit your workspace changes in order for them to take effect once preview mode is turned off. To do this, click “Submit” in the upper right-hand of the GTM view:

You will be prompted to add a message with your change, so be descriptive:

In order to test sending events to Drip, you’ll need to submit an email address to Drip through an opt-in widget. This way, Drip will track your events and associate them with your test subscriber record. If you’re not sure how to setup a form on your website, this article will get you going in the right direction.

Now, once you have submitted a form with your email address, go back to your website and run your click event again to see it register under the subscriber’s timeline:

Now that you have a better understanding of how to send events using Drip’s JavaScript API via Google Tag Manager, you can modify your tag/trigger to suit your needs!