I'm working on a website that I didn't build, which already has Google Analytics on it, but not the standard analytics.js function. This is what I'm referring to:
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-XXXXXXXX-X', 'auto');
ga('send', 'pageview');
Instead, what I've found on the website is this GTM snippet in the <head>
section:
(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXX');
And this at the end of the <body>
:
<noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-XXXX" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
I suspect the doubled pageviews are due to the analytics.js and GTM snippets co-existing, but when I try to track click events using the onclick
method and just the GTM snippet, I get Uncaught ReferenceError: ga is not defined
in the browser console. For reference, this is what I'm using:
onclick="ga('send', 'event', 'CATEGORY', 'ACTION', 'LABEL')"
.
I also tried logging when the elements in question are clicked, which worked.
I've installed the Chrome GA debugger extension and when I click on the element, it logs Command ignored. Unknown target: undefined
.
I guess my question comes down to: How do I track click events with GA and GTM running at the same time? I've used this GA method before and it has worked, but I've never used GTM snippets and I haven't removed it from this site to avoid breaking any other tracking since I'm not familiar with how it works in relation to GA.