DEV Community

loading...
Cover image for How to set up Google Tag Manager on Shopify (2021 Tutorial)
Analyzify

How to set up Google Tag Manager on Shopify (2021 Tutorial)

ekuplu profile image Erman Küplü Updated on ・5 min read

Google Tag Manager(also known as GTM) is one of the most influential and useful tools for marketers, entrepreneurs, developers, and many others. However, Shopify doesn't have a native integration for GTM and it is a little tricky to set it up.

Update (23.03.2021) This tutorial explains how to add GTM into Shopify directly. We have made a new - free Shopify - Google Tag Manager video course series on Youtube. Check out the video series if you want to further expand your data-analytics setup.

Why use Google Tag Manager on Shopify

Google Tag Manager allows us to manage all the marketing and tracking tags from one place, deploy and test quickly. Without using the GTM, marketers need developers to set up the tags - and even it isn't very easy for developers to set up certain tags in certain conditions. As a concrete example, you need to add the Google Analytics Global tag to all pages, the purchase event to thank you page, the form submission event to be triggered once the form is submitted correctly. All of them can be done quickly in GTM within minutes. I can count the benefits of GTM for hours, but the topic is now how to add the Google Tag Manager into your Shopify store.

Shopify - Google Tag Manager Integration

Shopify doesn't have a native integration with the GTM. There are two methods to add the Google Tag Manager container (code) into the Shopify stores. We will add the code manually into your Shopify store's theme and checkout files in the first method. In the second method, we will review a few Shopify apps that do the integration for you.

Method 1: Adding GTM into the Shopify Theme

It might not sound effortless, but it is actually quite applicable. We will walk you through the steps, and you will easily be able to add Google Tag Manager to your Shopify store. Follow the steps below, and don't miss the last step. Otherwise, the code won't be triggered on your thank you page, which is very important.

Step 1: Get your GTM Container Code

Register for Google Tag Manager if you are not registered already. You can follow this simple tutorial if you don't have an account yet. Once you are logged in to your account, click your GTM ID at the top of the screen and copy the given code below.
Google Tag Manager Code for Shopify
Copy the first code. Don't mind about the second code. That's rarely needed, and it will complicate the setup of your store. Once you make sure to copy the first container code - move to the second code.

Step 2: Insert GTM code into Your Theme Files

As we have your Google Tag Manager Container code in place, it is now time to place it into your Shopify store. You need to be logged in to your Shopify admin to do so.
Shopify Admin > Online Store (Left Menu) > Actions (Near your theme name) > Edit Code
Add GTM into Shopify theme Files - 1

Search "theme.liquid" on the left search bar and find

tag within the file. Paste the GTM container right below the tag.
Add GTM into Shopify theme Files - 2

Now the GTM code will be shown on every page in your store except for the checkout processing and thank-you pages.

An important note: If you are using a page builder plugin, you need to paste the code within those liquid files.

Step 3: Insert GTM code into Your Checkout Processing Page

Shopify's basic plans won't allow you to edit the checkout process and add codes there. But you can still add codes on the "order completed" page. This is a crucial step because you want to track purchases in your Shopify store.
Follow the steps below to find the Order Processing section.
Shopify Admin > Settings > Checkout > Order Processing Section
and then paste your GTM container code there.

Add GTM into Shopify Checkout

Now we are set. The GTM will work on your store pages and also on the thank you page. Let us remind you again that it won't work in the checkout steps (where the user enters their credit card and address information) - but it will still work on the order completed page.

Step 4: Validate if the GTM is working

With the data-related works, you always have to double-check and validate. GTM has a great tool called Debugger (also known as Preview & Debug Tool or Google Tag Assistant) to show you if the GTM works on your store and which tags/triggers are working.

  • Go back to your Google Tag Manager interface and find PREVIEW from the right-top corner. GTM Preview Mode Button
  • Enter your store's URL and click Start GTM Tag Assistant
  • It should open your store in a new window. Make sure that your browser is not blocking the pop-up. If yes, firstly allow it. You should see DEBUGGER CONNECTED at the right-bottom of the screen. GTM Debugger Connected
  • Go back to Tag Assistant, and you should be seeing the "CONNECTED" message here and the TAGS in your GTM account. Tag Assistant Connected

Method 2: Using a Shopify App for Google Tag Manager

The second option is using an app to add Google Tag Manager into your Shopify store. There are several apps in the market.

If you only need the GTM container, you do not need to use an app. Method 1 will work great for you. The apps are doing the same steps that we walked you through to make the GTM working on your store. If you are looking for an in-depth tracking setup, then we definitely recommend using an app. Because the apps will also insert dataLayers into your store, allowing you to track more actions such as product impressions, add-to-cart events, search listing actions, checkout process, remove from cart, user ID, and many others.

The app we developed, Analyzify does the following (and even more) for your store:

  • Add advanced dataLayers to track all essential actions
  • Provides you a complete GTM container that has all the triggers, tags, and many others,
  • Sets up Google Analytics 4 with all-important e-commerce features store (Learn more about GA4 for Shopify)
  • Provides custom setup support(at no extra cost),
  • Creates precious user metrics such as User ID, User Recency, User Type, User Lifetime value, and many others,
  • Sets up Facebook Pixel and all related events,
  • Sets up Google Ads conversion tracking and all related remarketing events

Analyzify is not the only solution in the Shopify app store. There are other cool apps as well. Make sure to check each of them before you make your decision!

Final Words on Usage of GTM on Shopify

We only walked through the installation and setup process in this tutorial. GTM is powerful and beneficial. You should research more and learn better to take advantage of it in the best possible way.

Discussion (2)

pic
Editor guide
Collapse
colortools profile image
Color Tools 🌈

Do you suggest adding Facebook Pixel and Google Ads Conversion Tracking through Google Tag Manager or using Shopify's default integration?

Collapse
ekuplu profile image
Erman Küplü Author

Shopify's native integration is great; especially for non-technical regular users. It also sends the most important events to Facebook & Google.

However, a well-set GTM structure would help much more. You could send more data and optimize the Ads better that way. You will need to use an app for that though. Analyzify could be an option - others are doing good too. Just check and compare :)

Otherwise, without a professional setup - with a normal GTM integration - you won't get much. So in that case; I recommend using Shopify's native & default integration.