Guide: Complete Shopify Ecommerce Tracking
Set up end-to-end Shopify ecommerce tracking with CleanClicks using the custom pixel, server-side webhooks, and ad platform relay.
This guide walks through setting up end-to-end ecommerce tracking for a Shopify store with CleanClicks. By the end, every product view, cart action, and purchase will be captured first-party and relayed to your ad platforms.
What You'll Set Up
- Client-side pixel — captures browsing events and GA4 purchase via Measurement Protocol
- GA4 first-party proxy — routes all GA4 tracking through your domain (Signal+)
- Server-side webhook — captures purchase events directly from Shopify servers
- Ad platform connections — routes conversion data to your platforms
Prerequisites
- CleanClicks account on Clarity plan or higher (ecommerce requires Clarity+)
- Domain added and DNS verified in CleanClicks
- Shopify store with admin access
Step 1: Install the Custom Pixel
- In Shopify Admin, go to Settings > Customer events
- Click Add custom pixel
- Name it CleanClicks
- Paste the pixel code from your CleanClicks Configuration > Ecommerce tab
- Click Save, then Connect
The pixel immediately starts capturing:
| Event | When It Fires |
|---|---|
page_view | Every page load |
view_item | Product page view |
view_item_list | Collection page view |
add_to_cart | Item added to cart |
begin_checkout | Checkout page load |
purchase | Order confirmation |
search | Search performed |
Step 2: Set Up the Server-Side Webhook
The webhook provides a server-to-server backup for purchase events. If a customer closes their browser before the confirmation page loads, the webhook still captures the order.
- In CleanClicks, go to Configuration > Ecommerce tab
- Copy the Webhook URL and Webhook Secret
- In Shopify Admin, go to Settings > Notifications > Webhooks
- Click Create Webhook
- Event: Order payment
- Format: JSON
- URL: paste the webhook URL
- Click Save
Step 3: Connect Ad Platforms
Go to Connections and connect the ad platforms you want to receive conversion data:
- Google Ads — OAuth connection + Customer ID + Conversion Action ID
- Meta — System User Token + Pixel ID
- TikTok — Access Token + Pixel Code
- Microsoft Ads — OAuth connection + Customer ID + Account ID
See the individual connection guides for step-by-step instructions per platform.
Step 4: Configure Vendors
Go to Configuration > Vendors and enable each connected platform. Enter the required credentials.
For ecommerce, the key conversion event is purchase. Most ad platforms automatically recognize this event name and match it to their purchase/conversion goals.
Step 5: Test the Flow
- Open your Shopify store in an Incognito browser window
- Browse to a product page
- Add to cart
- Complete a test checkout (use Shopify's test payment gateway or a small real order)
- Check CleanClicks dashboard for events within a few minutes
- Check each ad platform for the conversion (allow 15-30 minutes)
GA4 First-Party Analytics
CleanClicks v2.1.0 introduces first-party GA4 tracking for Shopify. Instead of relying solely on server-side Measurement Protocol (which creates "Unassigned" attribution in GA4), the new approach uses:
- Theme snippet — loads proxied gtag.js and fires storefront events (view_item, add_to_cart, begin_checkout, search) through your first-party domain. These events get proper traffic source attribution.
- Custom Pixel v2.1.0 — sends GA4 purchase events via client-side Measurement Protocol through the
/__cc/g/mpproxy endpoint, using the visitor's real_gacookie for session stitching.
If you were previously using server-side GA4 MP: Turn it off in the GA4 vendor tab. The pixel now handles purchase events client-side with proper attribution. Keeping server-side MP on will create duplicate events.
See Shopify Setup for full installation instructions.
Attribution Flow
Here's what happens when someone clicks your ad and buys:
- Visitor clicks ad → lands on your store with click ID in the URL (gclid, fbclid, etc.)
- CleanClicks tag captures the click ID and UTM parameters, stores them in a first-party cookie
- Visitor browses (CleanClicks tracks product views, cart adds)
- GA4 theme snippet fires view_item, add_to_cart, begin_checkout to GA4 through your first-party domain (proper attribution)
- Visitor purchases → Pixel sends purchase to CleanClicks AND to GA4 via Measurement Protocol (with session stitching)
- CleanClicks relays the purchase server-side to each connected platform with full attribution
- Shopify webhook also fires as backup, and CleanClicks matches it to the same visitor session
Result: Your ad platforms see the conversion attributed to the correct ad click, even if the visitor had an ad blocker.
Avoiding Duplicate Tracking
- Only use the CleanClicks Custom Pixel for Shopify. Don't also paste the
cc.jsscript tag into your theme. - If you have existing platform pixels (Meta Pixel, TikTok Pixel, etc.) installed in your Shopify theme, consider removing them. CleanClicks replaces them with more reliable server-side delivery.
- Disable existing GA4 scripts if you're using the GA4 theme snippet. Running two gtag.js copies sends every event twice.
- Turn off GA4 server-side Measurement Protocol if the pixel is sending GA4 purchase events. Check the GA4 vendor tab.
Related: Shopify Setup | Ecommerce Configuration
Last updated 6 days ago
Built with Documentation.AI