Version 3.2: Shopify Customer Events for GA4, Enhanced Conversions & Google Ads Conversion Tracking
ฝัง
- เผยแพร่เมื่อ 6 มิ.ย. 2024
- 🔹 Buy Now:
triangledigtalstore.myshopify...
IT'S ALIVE! In my view, this is the best and most robust way to do this-and probably how Shopify intended. You don't have to mess with the theme files at all. Just add the code to the customer events area, fill in the placeholders, and you're done.
Changes made on 2024-06-09
Version 3.2
- Added detection to see if events have fired more than once
- Fixed some styles in the console
- Added timing to events that fired
- Adjusted the position of the GTM ID for people to add their own
- Added a ton of comments at the top with some instructions too
- Removed all the GA4 events; now the container is just using the regular events. I noticed the GA4 remapped events with the e-commerce data were taking longer to load than the regular ones. I consolidated the events.
- Renamed the events in GTM
If you install this version (3.2), ensure you replace the customer events code, save, disconnect, reconnect, and reimport your GTM container.
📝 What You Will Learn:
- Integrating GA4 with Shopify using GTM, focusing on Shopify's pixel events.
- Setting up enhanced ecommerce tracking that leverages customer data.
- Implementing conversion tracking and capturing enhanced conversions through detailed customer event data.
- Practical tips for deploying your GTM container to effectively track customer interactions.
👍 Like, Subscribe, and hit the Bell icon for more detailed tutorials like this. Feel free to drop your questions or feedback in the comments below! - วิทยาศาสตร์และเทคโนโลยี
![[UNCUT] ฝันรักห้วงนิทรา | EP.9 (3/4)](http://i.ytimg.com/vi/ikd1tEhXbp8/mqdefault.jpg)
Some house keeping is required for those who followed the older versions of your code: Remove the DataLayer snippet and the GTM doe from theme file. Right?
The code you shared on Google drive is less than 509 lines of code. Is this the latest version?
Correct. Remove the old snippet and old reference to GTM in the theme.liquid. This one is easy, just add the snippet and use the new gtm container. And yes, I removed some unnecessary parts. If you downloaded it before this afternoon EST, download it again. Thanks for the comment!
@@Alessandro-Colarossi Thanks for the quick response. I am trying to see the events on chrome console but nothing is showing. Is there a specific setup in Console that allows me to see the events. This solution is similar to the one that was provied by Feedarmy Unfortunately, it clutters the urls on GA by adding long codes at the end. I removed the code and these additional codes that were attached to the urls in GA reports were gone.
@@zwayny I'm not familiar with the FeedArmy solution. This one should show the events in the console right away.
As you said, you might have to do some cleanup first. Make sure GTM is not implemented anywhere and that you are not using the Google/TH-cam app for GA4 and conversion tracking. Also, remove the snippet code from my previous versions. All that is required for this is to implemenbt it in the Customer Events area like I showed in my video, it should work without doing anything else - make sure it's saved and connected.
The GTM container I provided should also be useful to fire all of your GA4 events and your Google Ads conversion tracking.
@@zwayny You can use "dataLayer checker plus" chrome extension to see the dataLayer enabled through custom pixel without going to console.
Love the intro haha entertaining and informative!
WOW! Gigantic big thanks!
Thanks for the walkthrough! It was super helpful!
No problem!
Awesome!! I’d like to add another important event like sign_in and new user registers. How can I do this?
Thankyou! Thia is super helpful, all events are firing. Did you notice the default user_engagement event missing in GA4? It is not firing for me.
No idea, I will have to see what you see. This code and various versions of it to fit different shopify themes and sires are available for purchase on my website - triangledigital.xyz, also comes with an hour of support with me.
Hi, thanks for sharing
A question, How do you do enhanced conversion and dynamic remarketing without data layer?
You can scrape the DOM to do it. And use a custom JavaScript variable in GTM to echo it where you need to in the GTM tag.
I've got a chrome extension that will help with this:
chromewebstore.google.com/detail/gtm-variable-builder/feeboihdgpananoagfmbohoogoncndba
Hi Alessandro, quick question. I watched your other video and installed the gtag pixel in customer events in Shopify. It's tracking conversions perfectly on my Google campaigns. Thank You!
Now I need to get something similar going for Microsoft Ads. You had mentioned using the code in this video to do that for not only MS Ads, but also Google, Tik Tok and more. Are the directions on this code clear how to work with Microsoft and each platform? In other words, what information is needed from Microsoft Ads and each platform to make the pixel work?
Reason for asking is that I'm a very simple user. If all I had was conversion tracking for Google (which I have with your gtag code) and something similar for MS Ads, I would be satisfied. I'm not a big GA4 user. With that said, I'm not against installing the pixel talked about in this video if it will do everything I need it to do. Thanks for everything you do!
I'm working on an all encompassing GTM container. Stay tuned.
Hey there, here is the version with other platforms: th-cam.com/video/3mzjWrCq7U8/w-d-xo.htmlsi=9jz1hBJYJX1B_qzJ
Thanks!
Thank you for the update, Ive published this new version in shopify and version 2 was removed. I've done all the debugging and in the console.log, the events are showing. However, when checking the network, none of the events are showing. Only page_view and scroll are being tracked, and no purchase (checkout) 😢. Honestly dont know what happened there.
FIlter for collect. Seems fine on my end.
drive.google.com/file/d/1lP6ycYyHBGPWm1l8tXapyEwjNCSkqTA3/view?usp=sharing
@@Alessandro-Colarossi Cheers, everything was working as it should. The channel has two GA4 properties, one of which is not active. For some reason, the data is coming into the inactive property, even though the GTM gtag ID is connected to the new GA4.
Great video,Alessandro! I’ve a question - Can we use google Ads for print on demand stores? I have read mixed reviews like google doesn’t support print on demand business as POD stores don’t store stock but google is ok if we offer variants so would appreciate your thoughts on this.I have print on demand store on Shopify wherein I sell giftable jewelry that comes in a box with a meaningful message card and each of my products has at least 2 variants per listing.
This code version 3.1 handles variants so you should be ok.
@Alessandro-Colarossi tried clicking the Google Form for file used and received message:"The form Download the Shopify Datalayer and Container is no longer accepting responses.
Try contacting the owner of the form if you think this is a mistake." Is this still available? P.S. massive thanks for the video, loved the intro especially 😆
Awesome! Great to hear you liked the video. The code is now out of beta so it's paid and comes with support. Available to purchase at the link provided.
Hi Alessandro great video. Are you able to provide product-level sales data to get cart conversions reporting in Google Ads? From the video it looks like just enhanced conversion data is switched on and not new customer data or product-level sales data.
Also with most of our clients we are either using Cookiebot or pandectes for consent mode v2. Will this have an impact on the tags is there any addtional configuration required? Thanks
Do you mean this? support.google.com/google-ads/answer/9028254?hl=en
@Alessandro-Colarossi
How to see the dataLayer that is enabled through custom pixel? Because GTM preview don't work.
Gtm preview doesn't work with customer events. You'll have to just look at the debugger I made with the console output. In chrome, right click on a page, click inspect, then click console.
@@Alessandro-Colarossi You can use the "dataLayer Checker Plus" chrome extension to see the dataLayer without going to the console.
@Alessandro-Colarossi You can use dataLayer checker plus chrome extension to see the dataLayer without going to the console.
@@RahiMasumReja mine has more features than DataLayer Checker Plus.
Mine shows load times and a check as to whether the event fired multiple times.
Try the latest version of my customer pixel code if you haven't seen these features.
This version does not include dynamic remarketing, does it?
v3 now includes dynamic remarketing. Just updated everything now. Hope you find it useful.
@@Alessandro-Colarossi But how does it send the customer id? It doesnt seem like it does in the remarketing tag, or am I missing something?
@@jonashjjuhl7198 why do you need customer id for remarketing?
@@Alessandro-Colarossi You can't run dynamic remarketing with products without id, can you? Might have misunderstood something
@@jonashjjuhl7198 product id is required not client id. No worries - redownload v3.2 and install the GTM container - dynamic remarketing is all set up and working. All you need to do is add your conversion id to the tag in GTM from Google ads, then of course set up your campaign.
It is great but not compatible with Cookiebot and consent mode v2
In what way - can youi elaborate? Should be able to use the cookiebot integration with Shopify and GTM to get this off the ground and running. I can make a video on this in the future.
@@Alessandro-Colarossi It is sending Unassigned default channel group (half of sessions), it is the 2nd version
First of all big respect Alessandro, I will tip for sure after proper testings ;)
One question, do I understand correctly that no external dataLayer pushes will now trigger GTM which is installed via SandBox?
I am asking because I see you use standard event namings inside GTM like "purchase" it can't be triggered from outside right?
So, it's not that it can't be triggered-it can. It's that it can't be tested using the GTM debugger or by looking at the dataLayer in the console, which is why I'm pushing the output via console.log to the console so you can test things easily. You can purchase this code and a version I made with all ad platforms in one package at triangledigital.xyz.
@@Alessandro-Colarossi Thanks for your respond, I am referreing to Shopify article
I understand that GTM will not react on old dataLayer.push method made for example from theme code anymore. Here is the full quote-
"If you've previously set up Google Tag Manager, then you need to replace your dataLayer.push calls with Shopify.analytics.publish()calls. You can find your dataLayer.push calls in your theme.liquid files, in the Layout section of your theme editor.
You also need to replace the dataLayer.push calls in the checkout.liquid. However, because checkout.liquidisn't compatible with checkout extensibility, you need to use a UI extension to push data to web pixels."
The customer events work perfectly for standard Shopify website. I have a client that uses headless Shopify, do you know how to implement customer events for them? Is it even possible?
At this time I don't know anything about headless Shopify - if anything changes I'll make a video about it.
@@Alessandro-Colarossi Thanks! I have other tags for one of my clients that stopped working once I implemented customer events. Stuff like forms, clicks, scroll, etc. Is that expected?
@@conventionalischeating If you merged my GTM container with yours then there shouldn't be an issue. If you've overwritten your container with mine then you might have overwritten your orginal triggers.
Cool Video, Curious if you fixed the page_url issue, when an event fires from the customer event it has a weird @sandbox/secured/ something in the URL.
Thanks - not sure what you mean. Happy to chat about it though. Triangledigital.xyz meeting button up top. Friday is best.
Should we use version 3 from link you provided?
Which ever works best for you honestly. I have a feeling v3 will. Give it a try. No harm.
@@Alessandro-Colarossi version is best?
V3 is the best. It does less, but it's more reliable and you can do what it can't do with GTM.
A bit ridiculous that Shopify's code isn't compatible with Enhanced Ecommerce - you would think shopify would build it out around Google
Agreed. Their Google and TH-cam app doesn't do it by default. My code does it -- available here: triangledigital.xyz
@@Alessandro-Colarossi I also gave up on the Google App integration - very underwhelming given the hype. GTM all the way with shopify.