How to set up AJAX call tracking in Google Analytics?

11,428

Solution 1

Looks like you're mixing Universal Analytics (analytics.js and ga() calls) with Async Analytics (ga.js and _gaq.push()), but I don't see any code to initialize ga.js.

Try changing

var _gaq = _gaq || [];

to

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-12345-1']);
_gaq.push(['_trackPageview']);

(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);
})();

Solution 2

I think that at check in Google Analytics you select "Universal Analytics", and it uses a new code counter. Look in the browser DOM, there is no object "_gaq" - and is therefore an error. You tried to fix it with empty Array(_gaq).
Old code:

var _gaq = _gaq | | [];
_gaq.push (['_setAccount', 'UA-XXXXXX-1']);

Do not use old code! (And you can not use multiple codes counter 'UA-XXXXXX-1' - it's mistake)
New code:

ga ('create', 'UA-XXXXXXX-1', 'mysite.com');
ga ('send', 'pageview');

The new counter Google has a new syntax.
Documentation on the use of events: https://developers.google.com/analytics/devguides/collection/analyticsjs/events
Example of use:
I have a calculator on the page and I want to keep track of events by push of a button on it.
Category - "Using the Calculator";
Event - "Calculating the cost".
Old code:

_gaq.push(['_trackEvent', 'Using the Calculator', 'Calculating the cost');

New code:

ga('send', 'event', 'Using the Calculator', 'Calculating the cost');

Category and Event - is Required!
P.S.:Sorry. I have poor English and I used Google translator :)

Upd:

<script type='text/javascript'>

  (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');
//Use once per page
        ga('create', 'UA-1234556-1', 'domain.com');
        ga('send', 'pageview');
        //
        function submit_data(){

                var text_area=$('#textarea').val();
                var url ="functions.php";
                jQuery.ajax({
                    type: "get",
                    dataType: "text",
                    url: url,
                    data: {
                        what : "generate",
                        text_area: text_area,
                        t: Math.random()
                    },
                        success: function(data, textStatus){
                        $('#textarea').val(data);
                        ga('send', 'event', 'MyCategory', 'functions.php');
                        }
                });
        }

</script>

Solution 3

If you're using Universal Analytics (analytics.js) then switch this:

_gaq.push(['_trackPageview', 'functions.php']);

to this:

ga('send', 'pageview', 'functions.php');

Solution 4

Yes, just add this after your Google Analytics script to define the _gaq array:

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-65432-1']);
_gaq.push(['_trackPageview']);
Share:
11,428
Radek
Author by

Radek

Updated on July 28, 2022

Comments

  • Radek
    Radek almost 2 years

    I created my google analytics account. And copied and pasted the code provided into my index.php file. It seems to me that it works as I can see calls to www.google-analytics.com from firebug.

    Now I want to track how many times the 'functions.php' is called via ajax from index file.

    I tried to use _gaq.push(['_trackPageview', 'functions.php']); but it gave me Uncaught ReferenceError: _gaq is not defined. So I added var _gaq = _gaq || []; to my code. The error is gone but I cannot see any call to www.google-analytics.com after the ajax finishes.

    Could someone help me to set it up so analytics would track ajax calls?

    My code looks like

    <script type='text/javascript'>
      (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-1234556-1', 'domain.com');
                ga('send', 'pageview');
    
             var _gaq = _gaq || [];
    
            function submit_data(){
    
                    var text_area=$('#textarea').val();
                    var url ="functions.php";
                    jQuery.ajax({
                        type: "get",
                        dataType: "text",
                        url: url,
                        data: {
                            what : "generate",
                            text_area: text_area,
                            t: Math.random()
                        },
                            success: function(data, textStatus){
                            $('#textarea').val(data);
    //                      _gaq.push(['_setAccount', 'UA-12345-1']);
                            _gaq.push(['_trackPageview', 'functions.php']);
                            }
                    });
            }
    
            </script>