With the proliferation of gtag.js implementations, we can see that there’s a small-ish paradigm shift in how to implement Google’s stack of marketing tools.

As adding gtag.js snippets to the site code becomes more and more common (to cater to things like early Optimize loading), you might be at a point where you have lots of interesting information stored in the gtag.js queue but no way to access it in your Google Tag Manager tags and variables.

Fret not! There is a way. Read on for elucidation.

Tip 113: Use gtag.js events and parameters in Google Tag Manager

Whenever gtag.js is used to collect an event, this information can be used to create Custom Event triggers and Data Layer variables in Google Tag Manager.

The way it works is very simple. Take this example:

gtag('event', 'my_custom_event', {
  event_category: 'some category',
  event_label: 'some label',
  value: 15.00
});

Here my_custom_event is the “event action” in Google Analytics parlance. Coincidentally, it also becomes the event pushed into dataLayer. You can verify this in Preview mode, as it will show up in the list of events:

This means that you can create a Custom Event trigger with this “event action” to fire your tags when the gtag.js call happens.

As you can see, the parameters are also shown in Preview mode. The catch is that the parameters are embedded in a top-level key named eventModel. Thus, if you wanted to create Data Layer variables for them, you’d need to map them to:

  • event_category becomes eventModel.event_category

  • event_label becomes eventModel.event_label

  • value becomes eventModel.value

This method works with all events sent to gtag.js - Ecommerce as well, for example.

It won’t work with the config call, so the initial call to gtag.js, where you initialize the integration to Universal Analytics, for example, cannot be picked up by Google Tag Manager.

Summary

Short and sweet this time. This should prove useful for you if you want to access your site’s gtag.js integration with Google Tag Manager.

It’s not that rare to have both gtag.js and Google Tag Manager running on the site these days. There’s a convergence of sorts going on as well, with gtag.js’ tech stack merging with Google Tag Manager under the hood as well. In fact, if you look at the gtag.js library and compare it with the gtm.js library, you can see a lot of similarities. And then take a look at the Google Optimize library, and the App+Web library. See the trend?

For many, Google Tag Manager remains the main way of consolidating tracking on the site, so being able to access the gtag.js queue without resorting to complicated hacks is useful indeed, I think.