How To Install GTM on Shopify - Full Guide & More
This guide is meant for you to get the most out of Google Tag Manager (GTM) with Shopify Plus accounts in terms of tracking Analytics, Facebook and Google Ads
Note: This guide assumes Shopify Plus - if you need to install without having Shopify Plus, reach out to us.
Google Tag Manager is one of the must-have tools that can assist you in achieving the goal of gathering insights from your eCommerce activities.
What is Google Tag Manager (GTM)?
GTM is a Tag Management System (TMS) that places tags or code which is used for marketing, analytics, and testing on a website. The benefits of tag management systems has a lot of advantages if you own an e-commerce store. Allowing for granular and hassle free insights on user activity within the eCommerce store.
This article is meant for Shopify eCommerce store operators as an implementation guide.
Install GTM on your Shopify Store
Enable Basic E-Commerce Tracking through Shopify
Enable Enhanced E-Commerce Tracking through Shopify
Enable Facebook E-Commerce Tracking through Shopify
Install GTM on Shopify
Before installing Google Tag Manager with your Shopify store, make sure you copy the code snippets, that are provided by Google Tag Manager, in your liquid theme (theme.liquid) and in your checkout page (checkout.liquid).
The GTM code has two components - the header and the body code. Make sure to grab them from the GTM dashboard (tagmanager.google.com) - if you don't have anything created under tagmanager.google.com - follow Google instructions (instructions)
To add the Google Tag Manager code to your Shopify Plus store, Shopify recommends the following process:
1. Install GTM snippets in two files of your theme (not all theme files look the same, some are custom).
theme.liquid
checkout.liquid
Go back to the GTM dashboard and select
Admin -> Install GTM
Shopify Admin Dashboard -> click Online store -> click Themes
Theme drop-down -> click Edit Code.
1. Copy the first code snippet from Google Tag Manager into the <head> tags of your theme.liquid and checkout.liquid code:
2. Copy the second code snippet from the Google Tag Manager into the <body> tags of your theme.liquid and checkout.liquid code:
Go to Shopify admin -> click Save.
Go to GTM, continue finishing setup if need be. When prompted to add tags, do not add the following types of tags:
Universal Analytics for Google Analytics
Classic Google Analytics for Google Analytics
Facebook Pixel
If you’re not in the position to modify core theme files the other solution is within the Shopify Admin Dashboard
Implement GTM through Shopify Admin Dashboard
Copy your Universal Google Analytics (UA) script from Google Analytics
Paste your Google Analytics script into your Shopify Admin -> click Save
Copy your Google Tag Manager snippet from your GTM admin -> click Save
Shopify Dash -> Sales Channels -> Online Store -> Google Analytics -> Additional Google Analytics JS -> Paste
To troubleshoot Google Tag Manager installation, use the browser extension / add-on Google Tag Assistant.
Install Google Tag Assistant
To troubleshoot with Google Tag Assistant you need to:
1. Install Google Tag Assistant in your browser (Chrome is recommended).
2. On a new tab with your Shopify store.
3. Cick the Extension
4. Make sure to be logged in to your GTM account for deeper insights
5. If the tag is yellow or red - there are issues present.
6. Green is good - blue is acceptable but there might be discrepancies
At this point you can either install Google Universal Analytics through GTM which will deploy it on the Shopify ecommerce store or you can install Universal Analytics through the Shopify Admin Dashboard
Setting Up UA and E-Commerce Tracking with Shopify
Note: If you’re running Classic Analytics for any reason, you can upgrade in the Admin Dashboard
(Shopify Dash -> Online Store -> Preferences -> Google Analytics) ‘
If you haven't created an Analytics account do it now - use the same e-mail as the GTM account to simplify things.
1. Go to analytics.google.com
2. Grab the UA code given
3. Go to the Shopify Admin Dashboard
4. Online Store -> Preferences -> Google Analytics
5. Paste code -> click Save Troubleshoot
6. Return to Analytics -> click Real Time Dashboard
7. Open store in a new page -> find yourself under Locations
Turn on Enhanced eCommerce
8. Shopify Admin Dashboard -> Google Analytics
9. Check off Enhanced eCommerce
10. Login to analytics.google.com
11. Use top left drop down to navigate to VIEW
12. Click eCommerce Settings
13. Turn on eCommerce Settings
14. Turn on Enhanced eCommerce Settings
What is the benefit of enhanced eCommerce?
Not only does it show you the full sales funnel of when a user arrives on your site, adds a product to cart, navigates to checkout and successfully purchases. It allows for granular data such as bundle bought, product impressions, removed from cart and more. For a full explanation of enhanced eCommerce - take a look here.
Setting up Facebook E-commerce in Shopify
Before you begin installing - make sure that you have the pixel and a Facebook Ad Account (https://www.facebook.com/ads/manage)
1. Go to Shopify Admin Dashboard
2. Online Store -> Preferences -> paste the Facebook Pixel ID
3. Enable Facebook checkout from Facebook
Shopify Admin Dashboard
Click the + symbol next to Sales channels
Click the Facebook channel.
Click Add channel.
Click Facebook from your Shopify admin.
Click Get started.
Click Connect account.
Allow Shopify to connect with your business's Facebook Page and Facebook will verify your account information.
After your account's verified, you can enable Facebook checkout using your Shopify admin.
4. Navigate to Events Manager to troubleshoot / QA
You've not installed GTM, UA, enabled UA for e-commerce and running a Facebook Pixel with product information. Having Google Tag Manager installed allows you to deploy more code that Shopify has not integrated within their own stores framework. This includes useful heat mapping tools such as HotJar, Spotlight, Yandex Metrika, or programmatic impression pixels for tracking large scale buys and even customizing specific actions you would like to translate into data.
Make sure that you are properly labeling folders and have a process in place for keeping Google Tag Manager easy to read and navigate - once you begin tagging it can become a mess. Do not let the power of being able to tag anything take over reason - sometimes it can be counter productive to keep tags on despite tracking nothing.
If you need further assistance with GTM or Shopify - reach out to use at readonly@blackdroneconsulting.com or through our content form.