Getting started with liferay Deploying a Plugin Hooks in Liferay Setting up SSL Using Restful web service in Liferay Debug remote liferay server via Eclipse Create a Quartz scheduler in liferay Inter portlet communication Configure Google Tag manager(GTM) in liferay Using Dynamic and custom SQL query in Liferay

Configure Google Tag manager(GTM) in liferay

Using GTM to configure GA events

GTM simplifies the whole process of managing tags.In GTM terminology

We put a GTM javascript snippet on the concerned page,in portal_normal.vm in custom theme in liferay, containing the GTM id and a data layer structure(if needed) to map values from page to variables
Corresponding to data layer variables,we need to create Variables at GTM end,which retrieve data from data layer
Subsequently,we create tags,which are basically fields which maps variables from data layer to events,which are triggered on certain conditions,leading to events being sent to respective tracking tool(GA,in our case).

Below is a sample of GTM javascript snippet embedded on a page,

    <body>
    <!-- 1) Data layer section -->
    <script type="text/javascript">
        dataLayer = [{
                "page" : "<? Virtual path of the page ?>"
                ,"pageType" : "<? Page type ?>"
                ,"user" : {
                            "type" : "<? User type ?>"
                            ,"userId" : "<? Logged user id ?>"
                            ,"country" : "<? Logged user country ?>"
                            ,"userRole" : "<? Role of user ?>"
                        }
            }];
      </script>
    <!-- 2) GTM Container -->
    <noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-PK9HK8"
    height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
    <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
    new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
    j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
    '//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
    })(window,document,'script','dataLayer','<GTM-ID>');</script>
    <!-- End Google Tag Manager -->

Post including this script in page,we need to configure the respective variables and tags from GTM end.

Post we have configured the required fields,we can view events on GA console upon a user view.

In order to view the data sent from portal to GA,we can use Google Analytics Debugger plugin,to view events being sent to GA via browser console.

Contributors

Topic Id: 8723

Example Ids: 27215

This site is not affiliated with any of the contributors.