Tealium

Tealium helps us integrating various analytic platform. We need to just pass the tracking data to tealium and it will than send it over to all analytic sources.

In this post we will see how integrate Tealium datalayer and pass it to the tealium server.

1. First of all we need to describe our datalayer. This datalayer consists for all the values that will be tracked. For tealium to work we need the datalayer along with utag.js that will help tracking.

2. This datalayer needs to added to variable "utag_data". You can add number of variables that are required to be tracked. For e.g, 

    <script type="text/javascript">
        var utag_data = {
            "page_name": "Welcome: Home page",
        };
    </script> 

3. Then you will need to add the code that will render utag.js. utag_data should be loaded before utag.js. If utag_data is loaded after utag.js no data will be tracked. For better tracking results it is recommended that the tracking code needs to be populated after the opening of "body" tag. So, place both the utag.data and utag.js after the opening of body tag.Add the below code after utag.data is populated.


    <script type="text/javascript">
        (function (a, b, c, d) {
            a = '//tags.tiqcdn.com/utag/[ACCOUNT]/[PROFILE]/[ENV]/utag.js';
            b = document; c = 'script'; d = b.createElement(c); d.src = a;
            d.type = 'text/java' + c; d.async = true;
            a = b.getElementsByTagName(c)[0]; a.parentNode.insertBefore(d, a)
        })();
    </script>

4.This initial setup will start tracking the pages viewed.

5. To track click events add the code in "utag.link", for the elements on which the event needs to be registered."event_name" is the default value that should be tracked to identify it as an click event. Along with it you can also add other desired values. See the example below:

    <script type="text/javascript">
        utag.link({
            "event_name": "submit_button_click",

        });
    </script>