Back to all posts

How to Add GTM Code in Shopify

How to Add GTM Code in Shopify
How to Add GTM Code in Shopify

Table of Contents

  1. Introduction
  2. What is Google Tag Manager?
  3. Why Use Google Tag Manager in Shopify?
  4. Prerequisites
  5. Steps to Add GTM Code in Shopify
  6. FAQ
  7. Conclusion

Introduction

Have you ever wanted a powerful tool to monitor and analyze the activities on your Shopify store? Google Tag Manager (GTM) is your solution. GTM allows you to easily deploy and manage tracking codes on your website without needing a coding expert. Whether you're looking to track user behavior, optimize marketing campaigns, or enhance your ecommerce strategy, adding GTM to Shopify can provide invaluable insights.

In this comprehensive guide, we'll cover everything you need to get GTM up and running on your Shopify store. You'll discover what GTM is, why it's beneficial, and step-by-step methods to integrate it into your store. By the end of this post, you'll be able to successfully add GTM code to your Shopify site and leverage it to its full potential.

What is Google Tag Manager?

Google Tag Manager is a free tool that allows you to manage and deploy marketing tags (snippets of code) on your website or mobile app without having to modify and deploy your code directly. Tags are essential for tracking how well your website performs and how visitors interact with it.

Why Use Google Tag Manager in Shopify?

Using GTM in Shopify has several advantages:

  • Centralized Management: You can manage all your tags from one interface, eliminating the need to modify code directly in your store's themes.
  • Flexibility: Easily add or update tags, such as Google Analytics, Facebook Pixels, or custom HTML, without needing a developer.
  • Better Data Collection: More precise and comprehensive data collection helps in making informed decisions for marketing and operational strategies.

Prerequisites

Before we dive into the installation steps, make sure you have the following:

  • Admin access to your Shopify store.
  • A Google Tag Manager account.
  • Basic knowledge of HTML and Shopify's admin panel.

Steps to Add GTM Code in Shopify

Step 1: Create a GTM Account and Container

  1. Go to Google Tag Manager.
  2. Click on "Create Account" and follow the setup instructions.
  3. Once the container is created, you will receive two code snippets:
    • One to be placed in the <head> section.
    • One to be placed in the <body> section.

Step 2: Add GTM Code to Shopify Theme

  1. Log into your Shopify admin panel.
  2. Navigate to Online Store -> Themes -> Actions -> Edit Code.

Place the First Snippet (Head)

  1. Open theme.liquid under Layouts.
  2. Paste the first GTM code snippet just before the closing </head> tag.
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','YOUR-GTM-ID');</script>
<!-- End Google Tag Manager -->

Place the Second Snippet (Body)

  1. Go back to the theme.liquid file.
  2. Find the opening <body> tag.
  3. Immediately after the <body> tag, paste the second GTM code snippet.
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=YOUR-GTM-ID"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
  1. Click "Save" to apply changes.

Step 3: Verify GTM Implementation

To confirm GTM is correctly added to your Shopify store:

  1. Open Google Tag Manager and click on "Preview" to enter debug mode.
  2. Navigate to your Shopify store. If installed correctly, you should see the GTM debug console at the bottom of your store pages.

Step 4: Setting Up Google Analytics 4 (GA4) Using GTM

  1. Go to Google Analytics and create a new GA4 property.
  2. Copy the Measurement ID.
  3. Open GTM and create a new tag.
    • Select “Google Analytics: GA4 Configuration”.
    • Enter the Measurement ID you just copied.
    • Set the trigger to “All Pages”.
    • Save and publish the container.

Step 5: Advanced Tracking (Optional)

Adding Tags, Triggers, and Variables

Beyond basic tracking, you can set up more advanced tracking to gather detailed insights:

  1. Tags: These are bits of code that send information to third-party tools.
  2. Triggers: These tell GTM when to fire a tag. Common triggers include page views, clicks, or form submissions.
  3. Variables: These are used to store information that GTM needs for your tags and triggers.

Example: Tracking Form Submissions

  1. Create a new trigger in GTM.
  2. Select "Form Submission" as the trigger type.
  3. Configure the trigger to capture only specific forms if necessary.
  4. Create a new tag.
  5. Select "Universal Analytics" and set the track type to “Event”.
  6. Configure the tag to capture the form submission and link it to the new trigger.
  7. Save and publish the container.

Step 6: Testing and Debugging

  1. Use the GTM Preview mode to test all tags and triggers before making them live.
  2. Use Google Tag Assistant and other debugging tools to ensure the tags are correctly implemented and firing as expected.

Step 7: Maintain and Update Tags

Regularly review and update your tags, triggers, and variables to adapt to new marketing strategies or changes in tracking requirements.

FAQ

How do I test the installation of Google Tag Manager on Shopify?

After adding the GTM snippets to your Shopify theme, you can test the installation by:

  1. Going to GTM, clicking on "Preview," and entering the URL of your Shopify store.
  2. Open your store in a new tab and check the tag assistant for confirmation.

Can I install Google Tag Manager on the Thank You page in Shopify?

Yes, you can also add GTM to the Thank You page by pasting the GTM snippets in the "Additional Scripts" section found in Shopify's Checkout settings.

Why should I install Google Tag Manager in my Shopify store?

By installing GTM, you can effectively track and analyze user behavior, manage multiple marketing tags from a single interface, and adapt more quickly to changing marketing and analytical needs.

Conclusion

Integrating Google Tag Manager into your Shopify store is a powerful way to streamline your tracking and analytics setup. It provides the flexibility to manage various tags without directly modifying your website's code. By following the steps outlined in this guide, you'll be equipped to take full advantage of GTM's capabilities, ensuring better data collection and insightful analysis for your ecommerce strategies.

Remember, keeping your tags, triggers, and variables up to date is crucial for ongoing success. Happy tagging!