Shopify GA4 Pixel Errors
Nobody has claimed this yet.
- Dominant language
- Ruby
- Stars
- 11.9k
- Forks
- 1.5k
- Avg merge
- 17h 55m
- Merged PRs (30d)
- 3
Description
Getting railroaded by Shopify Support on fixing this issue. I need a developer to look at it. I know shopify devs are here and I know this isn't the place to post these types of issues.....but there really needs to be a place where devs can submit issues to Shopify and actually get devs to look at it, instead of random support people, which are generally useless.
Shopify's Google Analytics 4 Javascript implementation via Google Channel is being blocked by Shopify's CSP Headers on the checkout pages. Because of this begin_checkout and add_payment_info events are not getting tracked. You can confirm this by checking out any Shopify Google Analytics 4 website and you'll notice the discrepancy between "purchase" and "begin_checkout" events.
Google Analytics 4 loads javascript via many URLs, the most common being analytics.google.com, which is not added to CSP headers, so it's being explicitly blocked by browsers which enforce this.
Shopify needs to implement the CSP headers which are outlined in Google's Analytics 4 documentation here:
https://developers.google.com/tag-platform/tag-manager/web/csp#google_analytics_4_google_analytics
To use the Google Analytics 4 (Google Analytics) tag, the CSP must include the following directives:
script-src: https://*.googletagmanager.com
img-src: https://*.google-analytics.com https://*.googletagmanager.com
connect-src: https://*.google-analytics.com https://*.analytics.google.com https://*.googletagmanager.com
For Google Analytics 4 (Google Analytics) deployments using Google Signals, the CSP must include the following directives:
script-src: https://*.googletagmanager.com
img-src: https://*.google-analytics.com https://*.analytics.google.com https://*.googletagmanager.com
https://*.g.doubleclick.net https://*.google.com https://*.google.<TLD>
connect-src: https://*.google-analytics.com https://*.analytics.google.com
https://*.googletagmanager.com https://*.g.doubleclick.net https://*.google.com https://*.google.<TLD>
Full details of this issues are documented here:
https://community.shopify.com/c/shopify-apps/ga4-pixel-issues/m-p/1995798/highlight/true#M60995
Shopify while looking at this (or whom ever implements this channel/implementation) should also add the event "add_shipping_info" and should also include the required field "items" field in "begin_checkout" and "add_payment_info" events.
Also I'd recommend Shopify makes a more generic github project for developers who want to report bugs. Unfortunately this will be the 3rd time I've used this hack to fix thing on Shopify, which are being ignored otherwise.
I have other issues with Facebook Channel and Custom/App Pixels I'd like resolved as well, but I know talking with Support will get me no where.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
No repository files, tests, or entry points are identified, and the report concerns Shopify's Google Analytics 4 implementation on checkout pages rather than a named Liquid component. First confirm whether Shopify/liquid owns this implementation; completion would require resolving the reported checkout tracking gaps and the additional event and field requirements described in the issue.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- analytics, security, web-dev
- Issue type
- Bug
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 15/100