In order to get the most out of Google Tags, please review this article for some tips and best practices.

 

GTM Data Layer

Pulse Commerce adds a Data Layer object to the Google Tag Manager container. This enables you to use data points such as visited page information and order information in GTM Custom Tags.

In different pages, a Data Layer consists of different variables. For example, in the Order Confirmation page, the Data Layer contains order related information, as opposed to the Product Detail page which contains that particular product's related information.

 

Data Layer Examples

Homepage

push
({ 'pageType': 'Home Page',
'customerFirstName':'John', 'customerLastName':'Dev'
});
 

Product Detail Page

push({
'ecommerce': {
'detail': {
'products': [{
'name': 'Bluebirds Birdfeeder',
'id': 'B330',
'category': 'bird feeders',
'brand': 'Bayberry Collection',
'price': '79.96'
}]
}
},
'pageType': 'Product',
'customerFirstName': 'John',
'customerLastName': 'Doe'
});

 

Category Page

push({
'pageType': 'Category',
'categoryName': 'bird feeders',
'customerFirstName': 'John',
'customerLastName': 'Dev'
});

 

Shopping Cart

push({
'pageType': 'Shopping Cart',
'shoppingCartQuantity': '6',
'customerFirstName': 'John',
'customerLastName': 'Dev'
});

 

Order Confirmation Page

push({
'ecommerce': {
'purchase': {
'actionField': {
'id': '9949', // Transaction ID. Required for purchases and refunds.
'affiliation': 'My Store',
'revenue': '140.15', // Total transaction value (incl. tax and shipping)
'tax': '7.93',
'shipping': '14.360'
},
'products': [
{
'name': 'Bluebirds Birdfeeder', // Name or ID is required.
'id': 'B330',
'price': '79.96',
'quantity': 1
},
{
'name': 'Ivy Birdfeeder', // Name or ID is required.
'id': 'B670',
'price': '18.95',
'quantity': 1
},
{
'name': 'Hummingbird Wind Chime', // Name or ID is required.
'id': 'BC320',
'price': '18.95',
'quantity': 1
}
]
}
},
'totalCharged': '140.15',
'shipMethod': 'UPS Ground',
'customerFirstName': 'Florida',
'customerLastName': 'Address',
'pageType': 'Order Confirmation'
});

Order Confirmation Page with subtotal

 

[{
"ecommerce": {
"purchase": {
"actionField": {
"id": "11077",
"affiliation": "My Store",
"revenue": "30.87",
"tax": "1.84",
"shipping": "10.080",
"action": "purchase"
},
"products": [{
"name": "[Sample] Laundry Detergent",
"id": "CGLD",
"price": "18.95",
"quantity": 1
}]
}
},
"totalCharged": "30.87",
"orderSubTotal": "18.95",
"shipMethod": "UPS Ground",
"customerFirstName": "Pulse Commerce",
"customerLastName": "Dev",
"pageType": "Order Confirmation"
},
{
"gtm.start": 1504885435265,
"event": "gtm.js",
"gtm.uniqueEventId": 0
},
{
"event": "gtm.dom",
"gtm.uniqueEventId": 2
},
{
"event": "gtm.load",
"gtm.uniqueEventId": 3
}
]

 

Data Layer Variables

Variable	Page(s)	Description
pageType	All pages	Type of Page. Available types are, Product Group, Product, Category, Custom Content Page, Shopping Cart, Home Page, Order Review, Order Confirmation
customerFirstName	All pages	If the customer is logged in, customer’s first name
customerLastName	All pages	If the customer is logged in, customer’s last name
categoryName	Category Page	Name of the category
ecommerce	Product Detail and Order Review	This is the primary ecommerce object that includes product or order data.
ecommerce.detail.products	Product Detail	This is an array of “product” objects. In product detail pages, there will only be one item in the array since each page contains only one product. In Order Review page, this array will contain all products in the order.
ecommerce.detail.products.name	Product Detail	Name of the product
ecommerce.detail.products.id	Product Detail	SKU of the product
ecommerce.detail.products.category	Product Detail	Primary category of the product
ecommerce.detail.products.brand	Product Detail	Manufacturer of the product
ecommerce.detail.products.price	Product Detail	Customer price of the product
ecommerce.purchase.actionField.id	Order Confirmation	Order ID
ecommerce.purchase.actionField.affiliation	Order Confirmation	Webstore Name
ecommerce.purchase.actionField.revenue	Order Confirmation	Total revenue from the order
ecommerce.purchase.actionField.tax	Order Confirmation	Total tax associated with the order
ecommerce.purchase.actionField.shipping	Order Confirmation	Total shipping cost for the order
ecommerce.purchase.products	Order Confirmation	Array of products in the order
ecommerce.purchase.products.name	Order Confirmation	Name of the product
ecommerce.purchase.products.id	Order Confirmation	SKU of the product
ecommerce.purchase.products.price	Order Confirmation	Unit price of the product
ecommerce.purchase.products.quantity	Order Confirmation	Quantity of the product added to the order.
totalCharged	Order Confirmation	Total amount that was charged from the customer
orderSubTotal	Order Confirmation	Total amount for products before shipping or other charges
shipMethod	Order Confirmation	Shipping method selected by the customer for the order.

 

Accessing Data Layer from GTM

In order to access above data within Google Tag Manager, you need to predefine the variables in your GTM workspace. For example, in order to use Order ID in the Order Confirmation page you need to create a variable in GTM.

Here is an example on how to create a variable named OrderID that represents the unique order ID on order confirmation page.

1. Go to Variables > New
2. Change the name to Ordertotal. In your custom scripts, you will be using the {{Ordertotal}} variable where Order ID is required.
3. Select Data Layer Variable as the variable type.
4. Data Layer Variable Name is the actual variable name Pulse Commerce adds to the data layer. You can use the first column in the above table to determine the variable name. In this case, we pick ecommerce.purchase.actionField.revenue
5. Data Layer version 2 is selected by default. This can be left as it is.
6. Save. Now the {{Ordertotal}} variable is ready for use.

 

Adding Triggers

You may want to trigger your tag only in certain pages such as the Order Confirmation page. Google Tag Manager allows you to create triggers to fire your tag.

Here is an example on how to create a trigger for Order Confirmation Page.

1. Go to Workspace > Triggers in your GTM account
2. Click New
3. Update the trigger name to Order Confirmation Page
4. Select Page View as Trigger Type.
5. Check Some Page Views in the This trigger fires on section.
6. Set the conditions to Page URL > Contains > ss-check-me-out.asp
7. Save

 

Using Predefined Variables and Triggers in Custom Tags

After predefining the variables using the above method, they can be used in custom tags using curly braces ({{}}). For example, you can get the Order Total using {{Ordertotal}} in your custom tag.

In the “Triggering” section, you can add the trigger you just created, so the Facebook tag that contains the Order Total will only fire in the order confirmation page.

Here is an example that uses the Ordertotal variable for Facebook pixel on the Order Confirmation page:

Adding a Built-In Tag

Google Tag Manager supports a number of built-in tags. In order to use a built-in tag, simply go to Tags > New and then click Tag Configuration. From here you can select the Tag Type and follow the instructions on the screen.

For example, to use the HotJar, select Hotjar Tracking Code from the Tag Configuration. Then add your Hotjar Site ID, which you can obtain from your Hotjar account. Then add the All Pages trigger to trigger this tag on all pages of your site.

More Help for Advanced Users.

If you need more help related to Google Tag Manager, the below article contains a lot of information and how-tos:
https://www.simoahava.com/category/gtm-tips/