The recent introduction of <a href="http://analytics.blogspot.co.uk/2013/10/no-code-required-auto-event-tracking.html" target="_blank" rel="noopener noreferrer">auto-event tracking</a> for <a href="http://www.google.com/tagmanager/" target="_blank" rel="noopener noreferrer">Google Tag Manager</a> was a welcome piece of news for many of us keen to remove custom jQuery from within the container. But it quickly became apparent that, to make real use of the auto-event tracking feature, a few hoops needed to be jumped through - to get things just as one might expect. Over the last few weeks, we've started to repeat certain implementations - particularly for GA event tracking - and so I thought I'd share these here. The three common GA events being - outbound link tracking, file download tracking and form submission tracking. In putting together these, I came across a <a href="http://www.fourthsource.com/web-development/google-tag-manager-series-4-tips-tricks-setting-google-analytics-implementation-google-tag-manager-16156" target="_blank" rel="noopener noreferrer">similar recent post from Rachel Sweeney</a> (thanks Rachel!) - you will notice some overlap:
Macros
Macro Name: getDomain Macro Type: URL Component: hostname (tick strip "www") What this does: Returns hostname without www (there's already a default one called "url hostname" - leave this as it will also come in handy, although you might want to rename it to getFullDomain or something)
Macro Name: getFilename
Macro Type: Custom JavaScript
Custom JavaScript:
function() { var fileName = {{gtm.elementUrl}}.split('?').shift().split('/').pop(); return fileName.toLowerCase(); }
What this does: Removes query strings, searches for the last slash, keeps everything after it. Returns a clean document filename and extension.
Macro Name: getFiletype
Macro Type: Custom JavaScript
Custom JavaScript:
function() { var extension = (/[.]/.exec({{getFilename}})) ? /[^.]+$/.exec({{getFilename}}) : undefined; return extension; }
What this does: Uses our getFilename macro and some regex to grab file extension and return.
Macro Name: isOutboundUrl
Macro Type: Custom JavaScript
Custom JavaScript:
function(){ return ( ({{gtm.elementUrl}}.match(/^https?\:/i)) && ({{gtm.elementUrl}}.indexOf("{{getDomain}}")<0) ); }
What this does: Returns true if link starts with http or https AND link does not contain current hostname (sub-domains included) - otherwise returns false.
Macro Name: gtm.elementUrl
Macro Type: Auto-Event Variable
Variable Type:
Element URL
What this does: The value is determined by reading the 'gtm.elementUrl' key from the data layer. If populated by an Auto-Event, the result will be the 'href' or 'action' attribute of the DOM element that triggered the event, depending on the type of element.
Macro Name: gtm.elementId
Macro Type: Auto-Event Variable
Variable Type:
Element ID
What this does: The value is determined by reading the 'gtm.elementId' key from the data layer. If populated by an Auto-Event, the result will be the 'id' attribute of the DOM element that triggered the event.
RULES
Rule Name: event is form submit Conditions:{{event}} equals gtm.formSubmit
Rule Name: event is link clicked to download file
Conditions:
{{gtm.elementUrl}} matches RegEx (ignore case) .(txt|svg|png|jpg|eps|vsd|mov|avi|wmv|zip|rar|exe|pdf|doc*|xls*|ppt*|mp3)$
AND
{{event}} equals gtm.linkClick
Rule Name: event is link clicked to outbound
Conditions:
{{event}} equals gtm.linkClick
AND
{{isOutboundUrl}} equals true
Tag name: GA auto-events - Form submitted Tag type: Google Analytics Track Type: Event - category: Form- action: submitted: {{gtm.elementId}}- label: on: {{url}}Firing rules: event is form submit
Tag name: GA auto-events - Download links
Tag type: Google Analytics
Track Type: Event
- category: Download
- action: type: {{getFiletype}}
- label: file: {{getFilename}}
Firing rules: event is link clicked to download file
Notes: bug in GTM currently prevent these macros from being used on their own in event tracking fields. Adding a string prefix (like “type: “) seems to fix that
Tag name: GA auto-events - Outbound links
Tag type: Google Analytics
Track Type: Event
- category: Outbound
- action: link: {{gtm.elementUrl}}
- label: on: {{url}}
Firing rules: event is link clicked to outbound