Reliably fetching the Google Analytics Tracking ID from another script - javascript

I need to retrieve the Google Analytics Tracking ID via JavaScript for use in another script. Something like:
var ga_id = (typeof ga !== 'undefined') ? ga.getAll()[0].get('trackingId') : 'Unable to retrieve GA id'
My Analytics is loaded using Tag manager, so even though I'm running my own JavaScript quite late in the page, its not detecting the presence of the ga object. ( I can access it without a problem via the developer tools console.)
How can I ensure that ga has loaded before trying to access its properties?

It's there on window loaded and you can see it in the GTM preview like so:
I have this CJS in that var (used your code):
Although this is ample in my case, yours may differ, so what you can do is the following:
Make a custom html tag that runs on pageload and deploys a closure with a timeout in it.
In the timeout callback push a dataLayer event.
Now move the tag that you want to get the value of the property id for to the dataLayer event trigger (custom event).
This is not very elegant, but it'll work. Again, for normal implementations, Window Loaded should be ample.

Related

How to implement Google Analytics event tracking inside a React VR project?

This is loosely written to give a basic idea of what I'm trying achieve.
< VrButton onClick={props.userClick}>< /VrButton>
userClick={() => this.triggerTracking}
triggerTracking() {
ga('send', 'event', 'myEventCategory', 'myEventAction', 'myEventLabel');
}
I expect the code to trigger Google Analytics event tracking in the GA system when the user clicks on a button, but I get an error message - "ga is not a function".
I have GA set up in my index.html file, with the proper ID, and pulling in the latest analytics.js API.
React VR is all within a web worker context so it is not possible to access anything on your window without the use of native modules.
You can embed them directly in your client js and use the GA tracking functions as you normally would there. You will then call a function on your native module within your react VR app.
You can check out the documentation here: https://facebook.github.io/react-vr/docs/native-modules.html
Try using the window scope as:
window.ga('send', 'event', 'myEventCategory', 'myEventAction', 'myEventLabel');
I'm not familiar with React at all, but perhaps React causes some abstraction between the window and the react scope, making your ga() function unavailable.
Do next stps:
open the network debug tool of your browser.
reload your page
review loaded url list and check that www.google-analytics.com/analytics.js is loaded
If you does not see such url loaded - read google analitycks manual about how to setup google analytics on your page.
If you see such url replace url www.google-analytics.com/analytics.js with www.google-analytics.com/analytics_debug.js in your page, than reload and than go to console tab of your browser debugger and check the errors.

How to change referrer in Google Tag Manager via Javascript Variable?

After reading this article, it seems like I can create a custom Javascript variable to reset the referrer in GA tracking. I've created the variable 'referer' with the following code:
function() {
return {{Page Path}}.indexOf('/path/on/site') > -1 ? null :
document.referrer;
}
and added it to the Page View Event, and published those changes. However, when I go to /path/on/site still see the regular document.referrer passed in the Chrome GA Debugger. I do see a GTM Built in Variable called 'Referrer' - would that be overriding my custom 'referrer' variable? ... or, would I still see the original referrer in the GA Debugger, but then it wouldn't get counted in the Analytics on the GA side...?

Moving to Google Tag Manager broke our virtual pageviews

I recently transitioned my company's websites to Google Tag Manager. Due to the fact that our contact forms don't have unique confirmation pages with unique URLs, we use virtual pageviews to track conversions. The form is submitted, and the page reloads with new content and our conversion tracking codes.
Since migrating to GTM, all of our virtual pageviews stopped working. Now when I submit a form on our site, I get this in the console log:
ReferenceError: ga is not defined
ga('send', 'pageview', '/funnel_G1/premium1.html');
Before, we had Universal Analytics loading directly on the page. Now we are loading Universal Analytics through GTM. That is all that has changed and I can't figure out why our virtual pageview scripts no longer work.
This is script that fires on a form completion:
<script type="text/javascript">
$(document).ready(function () {
ga('send', 'pageview', '/funnel_G1/premium1.html');
});
</script>
When you moved to GTM, you likely also correctly removed all on-page GA code, which includes the standard GA snippet and also the
ga('create', 'UA-.....');
ga('send','pageview');
code. Removing the GA snippet also removes the creation of the "ga" object, which is why you are getting the error you see. With GTM, you will now need to send in your events and pageviews with tags. So what you could try to do is to push events to the dataLayer that help to trigger tags that fire your virtual pageview. In your specific case, you could do something like this when the form is submitted:
dataLayer.push({
'event': 'form complete',
'vpv': '/funnel_G1/premium1.html'
})
and then in GTM, you would need to create pageview tag that is triggered by the event 'form complete', and that also alters the page value to the value of the 'vpv' dataLayer key (ie. /funnel_G1/premium1.html).
The problem is that, GTM loads ga() function asynchronously. If you call ga() before it's loaded, you will run in to this error.
Solution is to somehow wait for ga() to be defined, or use dataLayer.push()
Edit
The solution we ended up using - we just did not include Analytics in the GA, but included them separately in source. GTM would handle other script icnludes except GA. This solution atleast did not break ga() usages throughout our project.

Google Analytics: setting _trackPageview onLoad

Does anyone know why this:
$('document').ready(function(){
_gaq.push(['_trackPageview', '/my-custom-url']);
});
..wouldn't get picked up by GA?
We have an embedded service which displays different states of a page (same URL), depending on where the user is in the journey - hence the need to set a custom URL for each phase.
The code looks fine but without knowing your domain and seeing the GA set up script it's hard to guess.
I'd suggest installing the Google Analytics Debugger Chrome Extension. This might let you know if the gaq had any issues getting setup.

Safe to create cookie before document ready?

I'm currently saving a cookie in jQuery's document ready event handler, like:
$(function() {
document.cookie = <cookie with info not dependent on DOM>
});
Is it possible and safe to save a cookie even earlier, e.g. as a JavaScript statement outside any event handler that executes as the JavaScript file is being interpreted? Any browsers that may not be reliable to do in?
It is 100% ok to read and write to cookies before the DOM has completed loading if you are not dependent on values from the DOM. If you use the Ghostery extension for Chrome and go to any website you can have a look at the tracking tags that load before the DOM is ready, most of which will be using normal cookies and that will give you an idea of how common it is to do this.

Categories

Resources