DEV Community

Cover image for How to set up Google Tag Manager on Shopify (+data layers)

How to set up Google Tag Manager on Shopify (+data layers)

Erman Küplü on November 17, 2022

This will be your go-to guide for understanding and setting up Google Tag Manager on on Shopify. We will be talking about Shopify but you can also ...
Read full post
Collapse
 
Sloan, the sloth mascot
Comment deleted
Collapse
 
ekuplu profile image
Erman Küplü •

That totally depends on your tracking & data collection strategy.

  • Do you want to see their data all together or separately?
  • Do visitors move between the domains/stores or do they work separately?
  • Do you use the same ad account for all or different accounts?

According to that you can choose using one GTM account or multiple. Good luck with your multiple Shopify stores!

Collapse
 
miaconn profile image
Mia Conn •

Wow, great stuff! Can I set up Google Ads conversion tracking in this method as well - using Google Tag Manager for my Shopify store?

Collapse
 
ekuplu profile image
Erman Küplü •

Thanks! I'm glad it was useful! Yes, you surely can!

Check out the image below. You need to create a new Google Ads Conversion tag.

Shopify Google Ads conversion tracking through GTM

Make sure to place your own Google Ads Conversion ID and Label. And then you can choose the variables that we have created above for:

  • Transaction ID
  • Total value

And it'll work like a charm! Just be careful with NOT using the same conversion label twice, somewhere else (such as hard-coded). In this way, the conversions will be counted twice.

Collapse
 
abdullaharik profile image
Abdullah Arık •

A very well written article. Thank you.

Collapse
 
doherty192 profile image
Cody Manning • • Edited

Hey there!

Great article!

Question: I set everything up as described, but seem to be missing the data layer on the TY page.

I see the product detail data layer elements via GTM Preview, but when I checkout and look at Data Layer in GTM preview, I only see {event: "gtm.load", gtm: {uniqueEventId: 3, start: 1680113265640}}

I pasted the exact code in Settings>Checkout>Order Status Page>Additional Scripts, as well as all the other steps.

Any idea what I might be missing?

Thanks again!

Collapse
 
doherty192 profile image
Cody Manning •

Nevermind. I figured it out. Your code block for the purchase page is out of date.

Collapse
 
venkateshwarans profile image
Venkateshwaran Selvaraj •

May I know what you did?

Thread Thread
 
doherty192 profile image
Cody Manning •

Hey there,

I forget the exact problem I was having...

But I believe I used this code as the base: analyzify.com/google-tag-manager-s...

If you compare them there's a section missing.

It looks like the top comment in this thread has another solution too.

Collapse
 
lynthius profile image
Tomasz Przyborowski •

Great, but your code will be out of date soon. Shopify will turn off additional scripts in a few months. The only way to achieve this will be through customer events (custom pixel) or a web pixels app. I tested both, and unfortunately, I don't think they work well. Maybe you will figure out something new :D I hope so!

Collapse
 
wayoo_vladimir profile image
WAYOO - Vladimir Mitic • • Edited

Thank you @ekuplu for the guide, there is a small bug in the checkout code so it would be great to update the article

To all who are strugling with TY Page and Chekout dataLayer

Just update this bit of code

<script type="text/javascript">
window.dataLayer = window.dataLayer || [];

{% if first_time_accessed and post_purchase_page_accessed != true %}
Enter fullscreen mode Exit fullscreen mode

With

<script type="text/javascript">
window.dataLayer = window.dataLayer || [];

window.appStart = function(){

{% if first_time_accessed %}
Enter fullscreen mode Exit fullscreen mode

Hope this helps... :)

Collapse
 
akramr90 profile image
Akram Ramadan •

Thanks for the great tutorial. Is there a data layer code for user information? To use advanced matching on some social media channels they require user info such as hashed email and phone number. If you have the data layer code for user info it'd be great if you can share it.

Collapse
 
matt_jones_490a08cc55859f profile image
Matt Jones •

Really banging my head on the wall. I'm on step 9.1 testing View Item and I'm getting the Tag Variants name in TM instead of what's in the page code. I have step by step gone through this 3 times and as this is a bulletproof tutorial, I'm hoping I've done something wrong, but I can't find it.

Image description

Image description

Collapse
 
matt_jones_490a08cc55859f profile image
Matt Jones •

I did notice I had that tag sending Ecomm data, I have unselected that and getting same result.

Collapse
 
luke0589 profile image
Luke-0589 •

Hey that's great stuff! Many thanks for sharing this very useful article. May I ask you why you are creating each variable in GTM for GA4 and you can't use the "Send ecommerce data" from dataLayer?