Tracking Drift Chat Interactions with Google Tag Manager

As we saw in our previous article, Google Tag Manager is a powerful tool that allows us to track all sorts of events on our website. It also means we just require 1 small code snippet implementation on site, and from there we can add/remove pixels and tracking code without bothering our web developer friends!

Drift Chat is our tool of choice for conversational marketing (also known as on site chat bots).

We find this a valuable lead generation tool for own website and for clients. It helps us quickly route new and potential customers to the correct people in the business faster than just using the traditional method of form fill > email > phone call.

Although GTM doesn’t support Drift tracking natively, we can build our own set of triggers and variables to measure conversation metrics (i.e. user replies, or chat box closed).

In this article we’re going to:

1. Set up the custom listener tag. We will use this tag to push values into the data layer.
2. Trigger set up: DOM Ready and Custom Event.
3. Create Analytics events by using custom variables.

1. Setting Up The Listener Tag

This is probably the most challenging step we are going to face while setting up our tracking events. We’re going to create our custom event for Drift chat and push it to the data layer.

Apart from GTM knowledge, an understanding of Drift’s API is needed to set up the tracking. Fortunately, we have already included a fully working code below.

We will create a new Custom HTML tag and paste the code above. The trigger we will use in this case is “Dom Ready” trigger in all pages where our drift shows.

This is what the custom HTML Tag looks like

2. Trigger Setup

In order to create a DOM Ready trigger, we will head to “Triggers > New Trigger”.

In the trigger configuration, we will use the “Page view > DOM Ready” trigger type.

DOM Ready rather than Page Views

After selecting it, we will fire it on “All DOM Ready Events”. We can save the trigger after this step.

The next step is to create our own defined trigger for the Drift event listener we have set up earlier. This trigger will fire when any of our custom events happens, for example when a message is sent by a user, as we have define it on our listener tag.

We will add another trigger, this type we select “Custom Event” under “Other” category. We will name it driftAction which will fire when “All Custom Events” with that name happen.

Important: Preserve capitalisation! JS is case sensitive

Almost done!

At the moment we have all of the custom HTML Tag implemented. We’re now listening to the custom events, but have to push everything into Google Analytics to measure the impact Drift has on the webpage. So, let’s go ahead and create the final tag and variables.

3. Creating The Variables

We need to create new variables that will store information from the values that we are going to push to GA. For example, the “eventAction” variable we will set up now, will have “user replies” as a value when a message is sent, or “Welcome message closed” when someone closes the welcome message.

To create these variables, 3 in total, we will head to “Variables > User-Defined Variables > New variable”. The variable type is “Data Layer Variable” (as these values are pushed into the data layer), with “eventAction” as the name. We will repeat these steps for “eventCategory” and “eventLabel” as well.

Creating the variables

Finally, the last step. We will create a new “Analytics Universal” tag following these instructions:

Tag Creation to push values into Google Analytics

And we are ready to publish and see how is it working.

Conclusion

We’ve seen how we can use the Custom HTML Tag to build our own listener to track Drift events. GTM gives us flexibility to track information in multiple situations, break it down to variables and use it across the website.

For example, we could create a tag with a trigger that would change a certain text on the website by using CSS selectors in case that the user has dismissed the box without any other interaction.

Once set up properly you’ll have another set of events in Analytics from which to make more informed marketing decisions and another step in the user journey to help understand how your people are moving through the funnel from research to purchase/conversion.

Recent Posts

Categories