Google tag manager custom event tracking - google-analytics

I am a developer in codiva.io a java ide for students. I am using codemirror editor.
I want to track on edits (specifically a pause or timeout after last edit).
I had previously used Google analytics, and for events, we will do ga.send(). Now I'm using Google tag manager, for clicks and other events it seems we can configure using tag manager ui itself.
With tag manager, I'm not able to find how implement tracking for this.
Codemirror generates an on change event. On each edit, clear any previous timer and setup a timeout trigger to run after 200ms. (The compilation will be dive at this point, and I want to make sure to track the number of times this event happened)

If I understand you correctly:
Use you change event to have a custom event pushed to the dataLayer:
dataLayer.push({event:'compile'});
Then create a trigger of the type "custom event", set event name to "compile" and use that to fire a Google Analytics event tracking tag (if you use the GA tag template you can select the hit type via a dropdown).
The "push" method of the dataLayer ist not the native array method but a special implementation by the GTM code; GTM uses this to monitor changes to the dataLayer, and the "event" keyword tells GTM to update its internal datastructure so new values become available to tags and triggers.
With the same push you can also pass data to be used as eventCategory etc:
dataLayer.push({
event:'compile',
eventCategory:'myCategory',
eventAction:'myAction',
....
});
You then create new variables of the "dataLayer" type and enter the name of the key you want to access. You can then use the variable in your Ga tag, either by selecting it from the autosuggest list (if you click the icon right to the eventCategory etc. fields) or by typing out the variable name with curly brackets, i.e {{myVariableName}}.
Also keep in mind that the "event" keyword in the dataLayer does not relate to Google Analytics events, except in the sense that it can be used to trigger event tracking (as well as any other tag). "Event" is just a keyword in GTM to indicate that data is updated and tags can now access the new data.

Related

Can We Use "Message" as an (custom) Event to Fire a Tag in Google Tag Manager?

I have an id being pushed to my data layer via dataLayer.push() and there is no event key at the moment.
I know the best practice is to use an event key like 'event': 'idPush' and then in Google Tag Manager UI, have a trigger that activates when the custom event idPush occurs.
Is there is a way that I can still get the trigger to activate upon seeing a generic 'Message'?
I can't be 100% sure because I haven't read the GTM source code and I couldn't find any articles that talk about this, but I'm reasonably certain that this can't be done.
I tried:
creating a Custom Event trigger with a regex match of .* which would match anything, including nothing.
matching undefined, because according to the preview pane, the _event variable is set to undefined for Message events.
Unfortunately neither of these worked, and preview mode just says No tags were evaluated for the Message. This leads me to think that GTM only checks to see if any triggers should fire when an event is pushed into the dataLayer.
No. Until there was an event, GTM does not know about the content of the message - the message is just the debugger telling you that something has been added to the global dataLayer variable (which exists in the global namespace of the browser, not the confined namespace of GTM). The even is what updates GTM's internal state to make it aware of changes and additions to the dataLayer.
Depending on your use case you might be able to use a trigger type that creates it's own event - e.g. setting a visibility trigger to an element that you know will be at the viewport after your message, which will then take the new values of the dataLayer into account. Or create a custom HTML tag with a setInterval functions that periodically pushes an event to the dataLayer.
While these solutions may work, I do not think they are actually good. Finding a solution to change your page code will almost certainly be less headache in the long run than using a workaround.

Execute Google Analytics Functions in addition to Google Tag Manager

When using the Google Tag Manager, is it possible to track some things the old way in addition to using the GTM?
For example, I use GTM in order to fire a page view.
However, I want to fire another page view, when a user clicks a button, also known as a virtual page view.
The button in question doesn't have an ID and I don't trust the othet agency, which handles these buttons to consistently keep the same IDs for these elements. So I would rather have them be responsible for these types of page views.
The code for the virtual page view would look something like that:
ga('send', {
hitType: 'pageview',
page: 'button2'
});
Since the tracker is already initialized by GTM, I would only have this code outside GTM.
Would this work if all other google analytics related things run over gtm and where should I put this code in this case? Somewhere after the GTM code on the page I'd imagine?
Google Tag Manager (GTM) by default uses a random name for each tracker, generated for each Universal Analytics tag. There is a possibility to use fixed name for trackers, which is highly discouraged. This means, that you might have difficulties to identify the proper tracker to use, when sending your additional pageview data.
There are however other methods to send virtual pageviews using GTM, where you can benefit from your existing Analytics settings, defined in Google Tag Manager. (Preferably by using Google Analyitcs Settings variable.)
As far as I understand, you have control over the code, to run some JavaScript on the relevant click event.
So instead of directly invoking the ga object, you can send the desired data to GTM, with a call like this:
dataLayer.push({
event : 'virtualPageView',
virtualPagePath : 'button2'
});
Obviously, there are a couple of things you need to set up in GTM, which will be able to act on this event, and send the pageview to Google Analytics.
Create a variable that points to virtualPagePath dataLayer variable, so the newly pushed value could be reused
Create a custom event trigger, that can be used with one or more tags. The event name should match your given event name, virtualPageView in my example.
You need an Universal Analytics tag, which will send the pageview. This tag should be fired by your new custom event trigger, and should have an extra setting compared to your regular pageview tag. Namely, page variable within the Fields to set block should point to the newly created dataLayer variable, that contains your virtual page path.
This way, Google Tag Manager will take care of creating the tracker for you, sending the hit to Google Analytics, and using the virtual page path variable provided by you, instead of the URL in the browser address bar.

Can I use same GTM tag to fire for multiple GA accounts?

I am working on one project which needs to fire same GTM tag to for two different GA account is this possible? or should I have duplicate all the same tags for two GA accounts?
There is no standard way to fire multiple properties in one tag. However I can think of two possible workarounds.
(Updated: The same questions came up on the GTM forum and naturally Simo Ahava had a solution).
One would be to create the tracker object manually in a custom html tag (the actual pageviews happen still via Ga tag templates). This would allow you to use Google Analytics plugins and there are plugins (e.g. here or here) that send hits to multiple properties.
The other workaround is to use a feature called tag sequencing. This has the advantage that you do it with "pure" GTM instead of GA plugins. I will first show the steps and explain what happens later.
The Setup
First you need to set up your tracking id as a variable of the datalayer type. As default value you set your first tracking id:
Next you create a custom html tag that will later set the second tracker id. This also sets a custom event necessary to fire the second tracker. Note that there are no triggers attached to this tag, and that it is set to "fire only once per page" (the last thing is very important! You can set this in Advanced Settings -> Tag firing options).
Then you create a trigger that uses the custom event from the previous step:
Now comes the magic with the GA tag. You use the variable for the tracking id that you have created earlier. Then you go to "Advanced Settings", expand the "Tag Sequencing" options and check the mark before "fire a tag after fires". You select the custom html tag from above (named set2ndId in my example). Then you attach a pageview trigger and the custom event trigger (called 2ndTracker in my example).
The sequence
GTM is loaded and evaluates the tracker id from the default value of the datalayer variable
The pageview trigger fires the GA tag
The tag sequencing setting fires the custom html tag that sets the datalayer variables for event and tracking ind
Since we have an event the datalayer is re-evaluated, and the new value with the second tracker id from the custom html tag is set
The custom event trigger fires the GA tag with the second tracker id
Since the custom html tag was set to "fire once per page" it is not fired again (else you would end up in a loop)
A word of caution: This is somewhat clever, even if I say so myself, but at the moment it is a bit "proof of concept". I use it without problems for pageview tracking, but I'm still working the kinks out for event tracking etc, so you have to decide for yourself if this is useful for you.
But at least it answers your question: yes, it is possible to send to multiple properties without duplicating the GA tags, but it takes some additional setup so you have to decide if this actually saves you work.
yes it is fine to fire multiple GA properties in single GTM.
Maybe this tutorial will help you:
http://www.kristaseiden.com/step-by-step-adding-a-second-ga-property-via-google-tag-manager/
I hope this helps.

Google Tag Manager and Single Page apps

I'm trying to integrate Google Tag Manager with my Ember app. I'm having a hard time understanding how to notify GTM that the page changed, and send a page view event.
I've read a lot of things online, mostly working around creating a new variable for a "virtual page" or something, but obviously this is far from ideal.
I'd like to be able to just use dataLayer.push to notify the page actually changed. Is there an easy way out I didn't find or is it really a pain to track with GTM on SPA?
This was asked quite a while ago. With the current feature set of GTM, you can easily set up SPA page tracking without much trouble.
First, go to Triggers and create a new trigger. Select History Change as the trigger type. This will create a trigger that fires every time the location history changes.
Then create a new Tag of Universal Analytics type and set it up as per the screenshot below.
[
As for the trigger, set the previously defined History Change trigger, and you're done. Every time a navigation occurs in your SPA, a page view event with the proper page path will be triggered.
EDIT: as trognaders pointed out in a comment, this does not track the initial page view. To remedy, simply add an additional trigger for your tag that fires on the Page View event (All Pages). See screenshot below.
You definitely need to push events into the dataLayer which you can then trigger a GA page view tag in GTM. So to push an event into the DL:
dataLayer.push({'event':'virtualPageView'});
Then setup a trigger called 'vpv' which fires on a custom event called 'virtualPageView'. Add that trigger to a GA tag.
The best thing to do is also send through the details of the virtual page when you send the event. This way you can set up variables that pull these dataLayer property values into the page view call. So you might do this:
dataLayer.push({
'event':'virtualPageView',
'page':{
'title':'contact us',
'url':'/contact'
}
});
So you'd setup a variable called 'DL- page title' (for example) which is a dataLayer value of 'page.title' and another variable called 'DL - page url' which is a dataLayer value of 'page.url'.
You then setup a new Universal Analytics tag which has all your usual pageview settings but with 2 'Fields to Set' (under More Settings). Set 'title' to {{DL-page title}} and 'page' to {{DL - page url}}
Finally set the trigger to 'vpv' and you'll find everytime you push the event + data into the datalayer you'll get a pageView fired off with your virtual page's title and virtual url.

Jwplayer Video tracking using GTM

First of all I am new to GTM. I am trying to implement GTM video tracking on one of our site which is using JW player.
I have followed couple of articles as follows:
https://www.thyngster.com/jwplayer-video-tracking-using-google-tag-manager/
In the above one I was clueless what to do after putting the tag code as I couldn't find how to trigger that.
I also followed this link, but it didn't work either:
http://ecommppc.com/2014/11/30/track-jw-player-videos-on-gtm/
I believe I know what is going on. The code/tag, trigger, and variable he has set up in the tutorial is only what pushes the information to the dataLayer itself. The final step would be to add another variable, a tag to capture it, and a trigger to send it.
The variable you need is the dataLayer variable (Available in GTM under Variables > User Defined Variables > New > Data Layer Variable). You then give it the name of the variable in the dataLayer you want it to capture. Specifically, any of the variables in the dataLayer.push action (i.e. video_url, duration, etc).
The trigger to use in this case is the Custom Event trigger. This trigger will specifically wait for an object to be pushed to the dataLayer with the "event" variable in it. In this case, you need a trigger to wait for an event with the name "video". You can also add filters, i.e. this trigger will only fire on specific URLs, or when other conditions are true.
Finally, you need another GA Universal Analytics tag, set up to track events i.e. Track Type: Event. In this tag, set the trigger to the Custom Event trigger you made earlier, and then click into "Configure Tag". Under "More Settings", click "Add Custom Dimension". Make sure the index you are using to send it to Google Analytics is not in use in your property already; other than that it doesn't matter what index you choose. Finally, add the variable name in the "Dimension Value" field in this format: {{video_url}}. Instead of "video_url", include the name of the dataLayer Variable you created earlier.
This should get GTM to grab the variable out of the dataLayer and push it to Google Analytics every time that "event" variable is seen in the dataLayer object.
Hope that helps!

Resources