How to track custom events when Google Analytics is managed by Google Tag Manager?

Question

I ended up having to use Google Tag Manager for my site, so Google Analytics is now a part of that. It's all set up correctly and working fine. However, I used to be able to track custom events on my site very easily, with the ga() function:

ga('send', 'event', 'Videos', 'play', 'Fall Campaign');

However, now ga() is no longer defined; I get an error in the console, ReferenceError: ga is not defined. I then tried the gtag() method and it also doesn't work (same error message):

gtag('event', 'aaa', {
  'event_category' : 'bbb',
  'event_label' : 'ccc'
});

How can I track events with Javascript code?

To be clear, I do NOT want to fuss with the Google Tag Manager. It's a million clicks to get anything done in there. ;-) I just want to call the Javascript directly, like I always could before.

Answer 1

Google Tag Manager (GTM) by default uses a random name for each tracker, generated for each Universal Analytics tag. AS GTM creates only named trackers, therefore no default (t0) tracker will be created. As no default tracker is created, you must provide a tracker name yourself. Therefore, you would need to now the tracker names, or somehow query and reference them, in order this to work, only by using ga() call directly from JavaScript.

There is a possibility to use fixed name for trackers, which is highly discouraged.

I have a recommended workaround for this. You still need to make a few GTM settings, but you can create a Google Analytics general event dispatcher tag, which you can later use to send any Analytics event calls from JavaScript.

Your tag setting will look something like this, where you can reference your Analytics settings, and all the event related variables from dataLayer:

Your event tracking code will look like this:

dataLayer.push({
  'event': 'GAEvent',
  'eventCategory': 'Videos',
  'eventAction': 'play',
  'eventLabel': 'Fall campaign', 
  'eventValue': undefined,
  'eventNI': true 
});

Please note, that it is recommended to always set all the relevant event values in dataLayer, even if no string or value should be tracked, so that no earlier dataLayer values would be inherited during the push merge. Also, you should update the non-interaction flag, as needed in your case. Your trigger should match the value of the event key.