If you’re tracking events in Shopify using the Shopify Pixel API, there’s some bad news: GTM Preview Mode won’t work on checkout pages.
Why? Because Shopify renders the Pixel API inside a separate iframe, so even though GTM loads, its debugger can’t see the events.
The same applies to purchase events if you’re using Checkout Extensibility on the order status page.
So how do you debug events?
Luckily, there are two solid workarounds:
1. Checking Network Requests in DevTools
This is the classic “old but gold” method:
- Publish your changes in GTM.
- Open the checkout page and launch DevTools (F12 → Network tab).
- Filter for analytics requests (e.g., collect for GA4).
- Check if your events are firing and sending the expected data.
2. Using a Debugging Tag in GTM
If digging through network requests feels like detective work, another approach is setting up a GTM tag that listens for events and logs them in the browser console (via console dot log).
Basically, you create a Custom HTML tag that watches the dataLayer and prints every event that fires. Once you publish it, just open the Console (F12 → Console tab), and boom — you’ll see all your events appearing in real time, like messages from the Matrix.
If you work with GA4 to BigQuery exports, be sure to check out my SQL cheat sheet.
