Why and How to Install Google Tag Manager on Shopify

If you are looking to install Google Tag Manager on Shopify, you are on the right place. In this guide, I will show you the step by step instructions to integrate Shopify with Google Tag Manager.

 

Why Tag Manager for Shopify?

Google Tag Manager is the most popular and widely used tag management solution for online ecommerce stores and websites. The benefits of using GTM are countless but I am only going to highlight a few essential benefits for you to get you started.

  1. Installing GTM on your ecommerce site improves your site speed. Because this is a tag management solution, flexible enough to store all your analytics and marketing tags. You have the control to fire tags when needed. Another part it plays to speed up your site is by calling all external files in one go. For instance, if you have multiple marketing tags in store, this will call them once without waiting for other tags to fire.

  2. You can set up Google Analytics event tracking without modifying code on your site. Hence, you don’t have to depend on a developer to implement code changes each time you set up new event tracking.

  3. GTM contains built-in tag templates for Google Analytics, Adwords, Facebook Pixel and more. It also works with few analytics and tracking tools.

  4. If you need to add any other script on your site you can use custom HTML tag without having to touch with your backend code.

 

Getting Started

First, you will have to create a Google Analytics account for your Shopify store. if you haven’t already done so. You can follow add Google Analytics to Shopify instructions for assistance. Make sure to follow just  the “How to setup Google Analytics Account” topic and stop when you get to the tracking code. As we will be replacing  the GA tracking code with  tag manager.

 

Setting up Google Tag Manager

Now you need to configure Google Tag Manager. Go to tagmanager.google.com and sign in using the same gmail id you previously used for Google Analytics.

After logging in, you will be directed to add a new account. Just fill in the name of your account and click the continue button.

setting up tag manager account

The next step is to add a container to your account. A container could be a website or a mobile app but in this case, we are adding a website.

If you are not sure about the container name, simply enter your website’s domain. Select ‘web’ to use this container for your ecommerce site.

add container name

Once you are done, click on the create button.

Then a pop-up window will appear displaying the agreement details. To proceed you have to accept the agreement and a new pop-up will then appear displaying your container code.

tag manager container code

Click on the ok button to close this pop-up.

Add Google Analytics Pageview Tag

If you want to execute ecommerce tracking then you should not add this GA pageview tag. Instead, you should add the GA tracking id in your Shopify store and enable ecommerce tracking. 

If you want to track ecommerce tracking with google tag manager then you will have to add the GA pageview tag inside tag manager. Here is a brief guide on connecting Google Tag Manager with Analytics

 

Adding Google Tag Manager to Shopify

You can add Google Tag Manager container code in two places. First in theme.liquid file and second on the checkout page.

Paste the GTM container code on the Theme.liquid file

Open your Shopify dashboard in a new tab.

From the left menu bar, navigate to Online Store >> Themes

Now, click on the three horizontal dots button and click on Edit HTML/CSS.

theme.liquid shopify page

Next, click on the theme.liquid file from the and paste the Google Tag Manager container code you previously copied just before the </head> tag as shown in the image below.  

add google tag manager code in theme.liquid file

Although it is not necessary to insert the second container code but you can paste it just below the body tag for your satisfaction.

Paste the GTM container code on the checkout page (for shopify plus)

From your Shopify store dashboard, navigate to settings and then click on the checkout tab.

Scroll down to see the Additional scripts field.

Paste the same GTM container code inside this Additional scripts field.

add tag manager code on checkout page

Save your settings.

Verifying Setup

Uptil now, you should have added Google Tag Manager on Shopify but you are not sure yet if followed the steps correctly and if you are receiving the accurate reports in Google Analytics.

First, we have to verify if we have added the GTM code correctly to our Shopify store. To do this follow the steps below.

Install Google Tag Assistant in your browser(Google Chrome would be better)

On a new tab open your Shopify store. Click the tag assistant icon and then the enable button.

enable google tag assistant

Now reload the same page and click on the tag assistant icon. If you have followed the above mentioned steps carefully, you will see the Google Analytics and Google Tag Manager tags firing successfully on your Shopify store.

tas assistant reports

If you are seeing the tags like above then you don’t have to worry about anything. But, if tag assistant is showing any errors you can scroll back to the top of this article and verify steps.

Sometimes, Google Tag Assistant shows errors even if your setup is correct. In this case, you can open your Google Analytics account and check real time visitors to verify. If you see any real time visitors you can then ignore the tag assistant error.