pushing custom variables with Google Tag Manager

Question

I am using GA code on my website like below

    <script type="text/javascript" language="javascript">
                    var _gaq = _gaq || [];
                    _gaq.push(['_setAccount', 'UA-xxxxxx-1']);
                    _gaq.push(['_setDomainName', '.myweb.co.uk']);
if (source != '') {
                        _gaq.push(function() {
                            extga._setCampValues(source, medium, name);
                        });
                    }
                    // Set the custom variable ranking
                    var url = String(document.referrer);
                    // confirm they came from G
                    if (url.indexOf("google.co") != -1 || url.indexOf("google.be") != -1 || url.indexOf("google.ie") != -1 || url.indexOf("google.fr") != -1) {

                        var urlVars = {};
                        var parts = url.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m, key, value) {
                            urlVars[key] = value;
                        });
                        // Push to GA Custom Variables
                        _gaq.push(['_setCustomVar', '1', 'Keywords Rankings', urlVars["cd"], 1]);
                    }
                    //Track the record in GA
                    _gaq.push(['_trackPageview']);

                    (function() {
                        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
                        ga.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'stats.g.doubleclick.net/dc.js';
                        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
                    })();
                </script>

Now i want to replace GA code with Google Tag Manager. My question is that how we can push cstom variables on google analytics while using google tag managera, currently i am pushing custom data for campaign with _gaq.push methods.

Regards, Habib

Answer 1

Another option would be to use a Custom Javascript Macro to handle the custom variable. You could put your entire set custom variable ranking within it:

function(){
var url = {{referrer}}; //there is a GTM macro for the HTTP referrer

// confirm they came from G
if (url.indexOf("google.co") != -1 || url.indexOf("google.be") != -1 || url.indexOf("google.ie") != -1 || url.indexOf("google.fr") != -1) {

    var urlVars = {};

    var parts = url.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m, key, value) {
        urlVars[key] = value;
    });

// Return the Custom Variable value
return urlVars["cd"];
}   

}

*Note, I didn't test this code, but it should be pretty close.

Then you can use that macro, you'd probably name it something like {{customVar1Val}} and plug that into Google Analytics tag:

Answer 2

Once you move to Google Tag Manager, replace your _gaq.push() with dataLayer.push(). Internally, dataLayer.push() calls _gaq.push() when a tag's firing rule is triggered.

Create a Google Analytics tag and configure with your account, domain name etc. By default, it runs on all pages using a firing rule.

You can either use the GUI for managing the GA configuration, or just use a custom html snippet and paste in your code.

You're going to want to use macros to build up your custom variables. Use a custom javascript macro and you can reuse your existing code. Then include the macro in your GA tag.

Answer 3

Your question can be answered at the Tag Manager developers guide. There is even a section called Migrating Tags to Google Tag Manager where you can read

... This section describes a best practice migration workflow. The process has 5 main steps:

1. Map your site (optional)
2. List item
3. Implement standard Google Tag Manager snippet
4. Add Events and Variables
5. Add tags with associated firing rules in Google Tag Manager's management interface
6. Final migration swap