Google Anlytics event not firing - google-analytics

I am not getting and event data in GA. I installed Google Analytics Debugger Chrome extension and I see nothing happening (same goes when looking at Network panel in developer tools). I Googled it and read many (many) other answers and it looks like I'm doing things right. Page views, etc. are registering correctly...
I have this code as the last thing before my closing tag:
<script>
(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','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-MYREALCODE', 'mybna.net');
ga('send', 'pageview');
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-MYREALCODE']);
_gaq.push(['_trackPageview']);
</script>
My event handlers are done using jQuery, all inside an external js file, loaded before the closing tag. For example:
$(function () {
$('#show-less').click(function (e) {
pbr.showHideMore(e);
_gaq.push(['_trackEvent', 'ShowMore', 'Hide', 'top button']);
});
});
Any ideas anyone?

Edit: I keep deleting and undeleting this anwswer because I'm not sure if your code is redundant or if you are actually trying to send data to two different properties.
If it's the first, see original answer below. For the latter make sure that you account/property-Ids are pointing to correctly configured properties (i.e. the first UA, the latter asynchronous), plus I'm pretty sure you need to include the ga.js liberary two if you want the methods pushed in the array to be executed.
You are mixing Universal Analytics and asynchronous code, that's not going to work (i.e. if you have ga send and _gaq.push in the same piece of code you are most probably doing it wrong). Adapt your event tracking code for UA and you should be alright.

Try wrapping the click listener in a document ready function:
$(document).ready(function(){
$('#show-less').click(function (e) {
pbr.showHideMore(e);
_gaq.push(['_trackEvent', 'ShowMore', 'Hide', 'top button']);
});
});
I often find that the listener won't link up until the DOM is fully loaded. Sometimes it does, though, but that might have to do with the code being below the object in question in the code.
It always helps me to put an "alert" into the click function while testing to be sure it's actually firing off (and catching) that event.

Related

Google Tag Manager tracking drop down menu/list (Web app built in R-Shiny)

I have a R Shiny app that I have connected to Google Analytics using Google Tag Manager (R Shiny app means AJAX website). I am currently tracking the standard stuff like PageViews, and have set up a tag to track which Tab a user clicks on (Using Click Element).
In most tabs, I have a drop-down menu/list (can be seen in the picture). When clicking on this list to select/change the input, the click element does not fire. So clicking does not work here.
In the same picture, I have included the source html code. I highlighted what I think is important. The default input is "Age Group (Discrete)." The "option value=" and "selected" changes the input (changed to "Pyramid (Discrete)"). And it also changes in the div class="item" data-value=..." line.
I do not know how to capture when a user changes the input using Google Tag Manager. I am however able to successfully track this if I put this GA code in my JavaScript file.
$(document).on('change', 'select', function(e) {
ga('send', 'event', 'widget', 'select data', $(e.currentTarget).val());
});
But the above only works if I also have this included:
ga('create', 'UA-######', 'auto');
ga('send', 'pageview');
Which means it is double-counting pageviews (tracking page-views on GTM and the GA code above).
I prefer to track what I want using just GTM. Any help would be appreciated. Let me know if the image is hard to see (May need to zoom in). Thanks
one possible solutions is using GTM custom events:
1) adjust your code to trigger custom event instead of sending GA event:
$(document).on('change', 'select', function(e) {
dataLayer.push({
'event': 'widget data selected',
'selected_value': $(e.currentTarget).val()
});
});
This will trigger specific widget data selected select that can be catched with Custom Event Trigger. Then just use that trigger for your regular Analytics Event GTM tag.
Additionally, you might set up user-defined Data Layer variable to read the selected option value from dataLayer and use it in your tag.

Value not passing to Facebook using GTM

I have a tag that sends purchase event to Facebook that looks like this:
<script>
fbq('track', 'Purchase', {
value: {{reservationValue}},
currency: 'ILS',
});
</script>
The reservationValue is a variable that the GTM gets from the page before the tag is fired.
For some reason, when i'm using the preview mode, I see that the HTML code that is sent to Facebook is:
<script type="text/gtmscript">fbq("track","Purchase",
{value:google_tag_manager["GTM-XXXXXXX"].macro(2459),currency:"ILS"});</script>
screenshot here
The same variable is used to send value of purchase to AdWords and when I preview the AdWords tag, the value is passing as it should.
I did Tag Sequencing and fired the pageview Facebook pixel before the purchase tag.
Any suggestions?
Thanks
I think this is normal behaviour because the syntax of GTM variables with the double curly brackets is the GTMs own syntax. what you saw there happens to every GTM variable. The GTM variables get "translated" to regular javascript again.
If you open the console within a browser and type in "google_tag_manager["GTM-yourContaienrId"].macro(2459)" you should be able to se the value assuming the Tag has been fired of course. You could also console.log the variable to see if it is being filled correctly.
The reason why you didn't see that behaviour on the AdWords tag is probably because it is a "native" tag type in the GTM and the other one is just plain html.
Change into:
<script>
fbq('track', 'Purchase', {
value: '{{reservationValue}}',
currency: 'ILS',
});
</script>

Why is Google Analytics Reporting Real Time Events?

I'm not seeing any events in GA Realtime reporting after implementing below code for GA Event tracking... Standard Pageviews reporting has been working fine for since I implemented last month, the issue is just with "Events".
I tried to follow the instructions per https://developers.google.com/analytics/devguides/collection/analyticsjs/events#overview.
This is a screenshot of my Chrome Dev Tools Console
https://www.dropbox.com/s/euamp6bz87qh6g9/Screenshot%202016-06-04%2018.33.19.png?dl=0
This is a screenshot of my Chrome Dev Tools Network:
https://www.dropbox.com/s/71lqmv492pquk1x/Screenshot%202016-06-04%2018.31.56.png?dl=0
Script in HTML before end tag with my UA number here noted as Xs/Y - i am using a server side with this code for each page:
<!-- Google Analytics -->
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-xxxxxxxx-y', 'auto');
ga('send', 'pageview', 'event');
</script>
<script async src='https://www.google-analytics.com/analytics.js'>
</script>
<!-- End Google Analytics -->
<!-- HTML Code -->
<ul>
<li>Download DICENTIS Wireless A & E Specifications</li>
</ul>
Any feedback on what I could be doing wrong would be much appreciated!
This is my edited and now working code based on feedback received:
<!-- HTML Code -->
<ul>
<li>Download DICENTIS Wireless A & E Specifications</li>
</ul>
If you are seeing pageviews and not events, then it's not really a matter time and waiting for the events to be processed, but probably something to do with your code or implementation. I am seeing a potential issue with the onclick code, however:
ga('send', 'event', 'download', 'click', ‘Download DICENTIS Wireless A & E');
Your event label is using a smart quote rather than a straight quote. When I paste the event code into the console, I get an error message, so you should change the ‘ to a ' and make sure they are all straight quotes.
Also, when you are sending your pageview with ga('send', 'pageview', 'event'), I'm not sure if you are aware, but you are changing the page path from the default of whatever is normally sent with the pageview, to event. So in your reports, you would see a page path for your pageviews of event.

Event Tracking code for multiple links in one banner

I have a banner on my sites home page, It has multiple links and the html code is written within tag and does not contains any anchor links, instead it has a href link only.
My IT heads says its not possible to embedd a onclick event tracking code to track all the links.
Please let me know how will i track this?
A pure unobtrusive javascript solution (derived from Googles example, working but not necessarily the most complete or beatiful code) :
function addListener(element, type, callback) {
if (element.addEventListener) element.addEventListener(type, callback);
else if (element.attachEvent) element.attachEvent('on' + type, callback);
}
links = document.getElementsByTagName('a');
for(i=0,cnt=links.length;i<cnt;i++) {
addListener(links[i], 'click', function() {
ga('send', 'event', 'button', 'click', 'nav-buttons');
});
}
If you put that in an external js file or an inline script it will "decorate" all links in the page (you would need a more specific selector instead of "all links") with a click event that fire google event tracking when somebody clicks the link. No embedded click code in the link tags necessary (that's bad practice in any case).
If you are already using jQuery (since that's probably the most popular javascript library) you can simply do
$( "a" ).click(function() {
ga('send', 'event', 'button', 'click', 'nav-buttons');
});
(again, choose a more specific selecor).
Both examples assume Universal Analytics, for classic you'd need to change the event tracking code (see DalmTos answer for examples).
The following examples will depend on if you are running classic VS universal analytics.
For Classic Analtyics look for ga.js in your tracking code:
Play
For Universal Analytics look for Analtyics.js in your tracking code:
Play
I don't see any reason why you wouldn't be able to track it in your banner.

Google Universal Analytics custom dimensions and trackpageview

I'm trying to migrate from Google old Analytics to Universal Analytics. I have code below and from universal - developers guide I couldn't find solution.
Inside my analytics code I had these lines. Part 1:
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-123456-1']);
_gaq.push(['_trackPageview','/tools/one');
_gaq.push(['_setCustomVar', 1, 'name', 'michael', 1]);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
Also inside my some other script I have this code snippet. Part 2:
if (typeof _gaq !== "undefined" && _gaq !== null) {
_gaq.push(['_trackPageview', '/dosomework']);
}
How can I convert "gaq.push"s inside 2 parts and add to my universal analytics code ?
Unfortunately, migrating to analytics.js isn't as simple as just changing the code syntax.
Firstly you should know that Universal Analytics is currently in open beta phase. Currently google does not offer a way to "upgrade" or "convert" an existing web property to take advantage of universal analytics (analytics.js) tracking. You will need to setup a new web property (or new account) and check the "universal analytics" radio button.
Google currently recommends setting up analytics.js code in addition to your current ga.js code. Once you are happy that the base data is lining up between the two, you can either keep both versions on your page or decide on a date to remove the old ga.js code. The historical data in your old profile will still be there but it won't be tied to the new web property. I don't know if Google will eventually offer an "upgrade" or "convert" feature for existing ga.js based web properties; so far I have not seen any news on if/when they will offer this.
Moving on to Universal Analytics (analytics.js) code ...
Universal Analytics does not use the .push syntax. Instead, it has a function ga() that requires arguments to be passed to it. The first argument is the "command" argument, and the additional arguments are for passing additional settings, values, etc. based on the command.
setting the GA account is now done with the 'create' command
tracking a page view is now done with with the 'send' command
setting a custom variable* is now done as either an argument in the 'send' command (for only popping it on that 'send' command), or with the 'set' command (for setting it to be popped with all 'send' commands executed on the page)..but about this...
Custom Variables no longer exist
Well they do, but how they are implemented is different. Universal Analytics offers custom dimensions and metrics. Custom Variables are mostly what Custom Dimensions now are. The main difference is that setting things like the name and scope of the variable is now done within the GA interface instead of as an argument to the function. Also, you get more than 5 to work with now. To set this up, click on the web property you created, and you should see tabs
Profiles Tracking ..Custom Definitions
Click on the Custom Definitions tab to setup your custom dimensions and metrics there.
Now on to the page code
This is what the "equivalent" of the code you posted would look like:
First snippet:
<!-- Google Analytics -->
<script>
(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','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-123456-1');
ga('send', 'pageview', '/tools/one');
ga('set', 'dimension1', 'michael');
</script>
<!-- End Google Analytics -->
note: as mentioned above, you would set the name and scope of the dimension within the interface. 'dimension1' should be changed to whatever dimension# you created.
Second snippet:
if (typeof ga == 'function') {
ga('send', 'pageview', '/dosomework');
}
sidenote: Not really related to your question, but in your code you first send a page view and then set the custom variable. In case you didn't know, if you set the custom variable (_setCustomVar) after the page view (_trackPageview), your custom variable will not be sent with that page view (the '/tools/one' hit). It will (assuming your 2nd snippet gets popped later on) be sent along with that 2nd page view (the '/dosomework' one). Not sure why you would have two separate pageviews or if you knew about that order of operations thing but if you're happy with how things currently look in the reports..well the analytics.js version will behave the same way.

Resources