Google Tag Manager Integration

Google Analytics can provide a lot of the important insights you’re looking for, but when used alone, it does have its limitations.

You can use tags for all sorts of purposes, including scroll tracking, monitoring form submissions, conducting surveys, generating heat maps, remarketing, or tracking how people arrive at your site.

Read below a systematic guide to integrate Google Tag Manager with your OnPrintShop website.

Step – 1 Registration with Google Tag Manager to create account

Go to, https://marketingplatform.google.com/about/tag-manager/ and Sign in to Tag Manager.

Next, is to create an account. Click on Create Account button.

To complete the account setup enter your account name and select country. Next, for container setup enter your website name and choose the target platform as Web.

Step – 2 Add the Google Tag Manager code

After creating the account the Google Tag Manager pop up will appear.

Copy the <head> tag code and paste it in the below path in Admin Panel – Admin >> Store Configuration >> External Service Settings >> Digital Marketing tab >> Google Tag Manager

Copy the <body> tag code and paste it in the below location of Admin Panel – Admin >> Store Personalization >> Language Text References >> search ‘noscript message’

Step – 3 Check the Google Tag Manager Plugin

The above configuration will enable the Google Tag Manager Plugin on Google Chrome.

If not downloaded then download the plugin from - https://chrome.google.com/webstore/category/extensions?hl=en

Open your website and enable the Google Tag Manager Plugin.

Now, navigate to any product page of your website and you’ll see that the Google Tag Manager is enabled for your website.

Step –4 Create a variable in Google Tag Manager

Next, is to create a variable in Google Tag Manager. For this go to its dashboard and click on Variables.

Next, click on the NEW button to add a variable.

Enter the variable name as – Google Analytics Tracking ID

Click on the pencil-like icon and choose the variable type as – Google Analytics Settings. This variable will allows configuring Google Analytics settings across multiple Google Analytics tags.

Next, enter the Google Analytics Tracking ID. To get the ID to follow check out the steps given at - Google Analytics settings variable

You can also follow these steps –

Sign in to your Analytics account.
Click Admin.
Select an account from the menu in the ACCOUNT column.
Select a property from the menu in the PROPERTY column.
Under PROPERTY, click Tracking Info > Tracking Code. Your ID is displayed at the top of the page.

After these let the Cookie Domain be auto.

After these configurations, your screen should look something like below –

Step – 5 Create Tags in Google Tag Manager

Now, one needs to create 5 tags in the Google Tag Manager.

Under your workspace click on Tags.

Click on New to add a tag.

Enter the tag title – Add to cart.
Under Tag Configuration choose tag type as – Google Analytics: Universal Analytics
Track Type as – Event
Enter Category as – Enhanced Ecommerce
Under Action write – addToCart
Keep Non-Interaction Hit as – True
For Google, Analytics Settings choose the variable created in the previous step i.e. Google Analytics Tracking ID
Tick the Enable overriding settings in this tag checkbox
Now under More Setting scroll down to Ecommerce and set Enable Enhanced Ecommerce Features as True.
Tick the Use Data Layer checkbox.

Now click on Save. This will open a pop-up stating No Trigger Selected which means this tag does not have a firing trigger. Unless a trigger is added, this tag will not fire. Click on Add Trigger.

Click on the ‘+’ icon to add a trigger.

Enter trigger name as – Add to Cart
Choose trigger type as – Custom Event
Write event name as – addToCart
Under ‘This trigger fires on’ select – All Custom Events
Click on Save.

Your Trigger Screen should look like below –

After adding the Trigger your Tag screen will look like below –

Similarly, you can create other tags and triggers with the same setting. All you have to do is change the names.

Tag Title	Action (Tag)	Trigger Names	Event Name (Trigger)
Checkout	purchase	checkout	checkout-complete
Product Impression	productImpression	productImpression	productImpression
Product detail	productdetail	productdetail	productdetail
Remove from Cart	removeFromCart	removeFromCart	removeFromCart

Step – 6 Save the changes made

Now go to Workspace >> Overview

Click on Preview and then on Save.