Google Tag Manager in Salesforce

What is GTM? 

Google Tag Manager is a tag management system that allows you to update measurement codes and related code fragments collectively known quickly and easily as tags on your website or mobile application.  

Usually, GTM is used to track the users who visit different website pages. The Marketing team will further analyze based on that data. What if websites like Amazon store large numbers of metadata, product, and user details on their server. Then, this cannot be handled by GTM admins. Using GTM Data layers, we can send data from Salesforce to GTM to track those data.  

Use Case: Let us take Amazon. If the user logs into amazon and searches five different products now. Out of five he adds only two products to his Wishlist. Not Amazon will only be able to track down only those 2 products but by using GTM, whenever the user selects any product or redirects to a different page then that information will be tracked by GTM. 
 
 
Create a new account and container: 

Log into tagmanager.google.com with your google account. On your home page, Click the Create new account button. The new account is nothing but creating a new workspace for your project. 

As part of the account creation, a container is required. The container is like a subfolder for our project. We need to make sure to select the appropriate target platform. Google Tag Manager is for our website, mobile application, or any other server-side. 

Once the account is created, click on the GTM id from the home page to copy the head script. 

How to use GTM scripts on Salesforce? 

Salesforce does not support GTM directly. I.e. We cannot use any custom component or custom code from our community to call the Google Tag manager.  

Step 1: Create an Event Dispatcher in your custom component that passes Name and Country. 

    document.dispatchEvent(new CustomEvent(“UserDetails”, { “detail” : {  

  Name: “Arun”,  

                 Country : India 

                 })); 

Step 2: Community header is the only way to send data from the Salesforce Community to GTM. So, paste the head script on the community header and create an event listener 
 

<script> 

    document.addEventListener(UserDetails, function(e) { 

        window.dataLayer = window.dataLayer || []; 

        window.dataLayer.push({ 

            ‘Name’ : e.detail. Name, 

            ‘country ‘: e.detail. Country, 

        }); 

    }); 

</script> 

Now, whenever the event is dispatched, Name and Country will be sent to the Google Tag manager. 

Reference links:  

 Container Creation: https://support.google.com/tagmanager/answer/6103696?hl=en 
 Date Layer: https://developers.google.com/tag-platform/tag-manager/web/datalayer