How to place Custom Variables in the new Google Analytics Code

Question

I wanna place Custom Variables in Google Analytics but Ima little bit confused about the syntax.

This is what Google gave me to place on my site:-

(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-xxxxxxx', 'xxxxx.com');
  ga('send', 'pageview');

This is what I want to use for Custom Vars:-

var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-xxxxxx-XX']);
  _gaq.push(['_setCustomVar', 1, 'age', '<?php echo $_GET["age"]; ?>', 1]);
  _gaq.push(['_setCustomVar', 2, 'gender', '<?php echo $_GET["gender"];?>', 1]);

Now the example I saw says that I've to put the Custom Variables code as :-

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-xxxxxx-XX']);
  _gaq.push(['_setCustomVar', 1, 'age', '<?php echo $_GET["age"]; ?>', 1]);
  _gaq.push(['_setCustomVar', 2, 'gender', '<?php echo $_GET["gender"];?>', 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);
  })();

but it seems that the last three lines are old way of how google did page views, what google now gives (the first posted code) is how google does it now. Do you think it is correct? or should I just paste this code on top of what google gave me?

So, in short is this correct Google Analytics code, for me to add a custom Variables?

  var _gaq = _gaq || [];
      _gaq.push(['_setAccount', 'UA-xxxxxx-XX']);
      _gaq.push(['_setCustomVar', 1, 'age', '<?php echo $_GET["age"]; ?>', 1]);
      _gaq.push(['_setCustomVar', 2, 'gender', '<?php echo $_GET["gender"];?>', 1]);
      _gaq.push(['_trackPageview']);


(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-xxxxxxx', 'xxxxx.com');
      ga('send', 'pageview');

Answer 1

You are indeed mixing up 2 incompatible Google Analytics libraries - ga.js and analytics.js.

Custom Variables as such do not exist in the analytics.js library and you should use Custom dimensions instead. If you define your age and gender variables in Javascript, you can then use the following call to pass them along with a pageview :

<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-XXXX-Y');
ga('send', 'pageview', {
 'dimension1':  age,
 'dimension2':  gender
 });

</script>

Scope (hit/visit/visitor) and variable name are defined in the Google Analytics Custom Dimension interface - not in your code.