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
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.
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.