Is it possible to put Google Analytics code in an external JS file?

Question

var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));

try 
{
    var pageTracker = _gat._getTracker("UA-XXXXXXX-1");
    pageTracker._trackPageview();
}
catch(err) {}

Would it be possible to call this script from an external JS file? I wanted to to something like:

<script type="text/javascript" src="googleanalytics.js" ></script>

and put one of these on each of my HTML pages.
The code I have above will be inside googleanalytics.js
Google's instructions was to put the code in each page. The problem with that is it makes it harder to change the tracking code. (We use different tracking codes for our DEV and PROD pages).
I've tried it out and it doesn't seem to be working.
Is there something wrong with doing that? Or is there something else causing the problem?

Important FYI Please note that we are using IE6 and 8 browsers (yes, I know, no need to tell me)

Answer 1

Yes this is possible. If it is not working then there is something else going on.

Just a thought, Google Analytics is usually about a day behind in reporting so when you make changes it will take some time before you know it is working. What I like to do is hit a page that does not get traffic very often to assure me that I have my tracking set up correctly.

Also, you might try making the link an absolute link in your <script tag. It might just be looking in the wrong place for the analytics code.

Answer 2

Can you not use your server-side language to output the code at the bottom of each page? Have a function such as output_ga() and call that. That way you can change it in one place.

Answer 3

I came across this post while trying to resolve a similiar issue. After searching further I came across another post that worked for me:

Using Google Analytics asynchronous code from external JS file

I had to move the var _gaq outside of the function it was in so that it became global.

Hope this helps!

Answer 4

This will work if you divide the script into 2 scripts the same way Google Analytics has divided the traditional script into 2 script tags.

Answer 5

i got an easy way to do this... Since analytic js is asynchronous it won't give any problem...

include below code in any js file (Please Note: The code i used is new analytics code provided by google analytics)

var imported = document.createElement('script');
imported.src = 'https://www.googletagmanager.com/gtag/js?id=UA-12xxxxxxx-1';
document.head.appendChild(imported);


window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());

gtag('config', 'UA-12xxxxxxx-1');

Answer 6

Wrap google code into function and execute on each page ;)

Answer 7

@Nikko

One possible reason is because the GA account was created using the old analytics. So you must use the traditional analytics code ga.js (_gaq.push). I found an incompatibility in using the new analytics.js with the traditional GA account in the GA website. The hits won't appear so I was forced to use the traditional ga.js.

Also, you may set a callback function to assure the hits are successfully sent, like below:

//traditional way
_gaq.push(['_set', 'hitCallback', function() {
  console.log("%c ga.js finished sending pageview data to analytics %s ", "color:black; background: pink", pageviewUrl);
}]);

//new analytics way
ga('send', 'pageview', {
            'page': pageviewUrl,
            'hitCallback': function() {
                console.log("%c analytics.js done sending data. pageview url = %s ", "color: black, background: pink", pageviewUrl);
            }
        });

where pageviewUrl = the url of the site

Hope that helps!

Answer 8

Upload google analytics dynamically:

function loadGoogleAnalytics(){
    var ga = document.createElement('script'); 
    ga.type = 'text/javascript'; 
    ga.async = true;
    ga.src = 'https://www.googletagmanager.com/gtag/js?id=UA-XXXXXX-XX';

    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(ga, s);
}

loadGoogleAnalytics(); //Create the script  

window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());

gtag('config', 'UA-XXXXXX-XX');

Don't forget to replace XXXXXX-XX with your account id.