Installing Browser Pixel in Shopify
The browser pixel tracks customer behavior on your Shopify store, including page views, product views, add to cart, and checkout events.
Why Install the Browser Pixel?
- Track the complete customer journey from landing to purchase
- Capture click IDs (fbc, gclid, ttclid) from ad URLs
- Works alongside server-side webhooks for redundancy
- Provides real-time event tracking
Step 1: Get Your Pixel Code
- Go to your store in TrackFlow
- Click the Setup tab
- Copy the pixel code from Step 1: Browser Pixel
Step 2: Add to Shopify Customer Events
- Go to your Shopify Admin
- Navigate to Settings → Customer events
- Click Add custom pixel
- Name it "TrackFlow" (or any name you prefer)
- Paste the pixel code from TrackFlow
- Set Permission to "Not required"
- Click Save
- Click Connect to activate the pixel
Pro Tip
After connecting, visit your store and browse a few pages. Then check the Events page in TrackFlow to verify events are being tracked.
Events Tracked
- PageView: Every page load on your store
- ViewContent: Product page views with product details
- AddToCart: Items added to cart with value
- InitiateCheckout: Checkout started
- Purchase: Order completed with order value
Verifying Installation
- Open your store in a new browser tab
- Browse to a product page
- Add an item to cart
- Go to TrackFlow → Events
- You should see PageView, ViewContent, and AddToCart events
Troubleshooting
Events Not Appearing
- Ensure the pixel is Connected (not just saved) in Shopify
- Check browser console for JavaScript errors
- Verify the Store ID in the pixel code matches your store
- Clear your browser cache and try again
Duplicate Events
- This is normal - browser and server events are deduplicated using event_id
- Having both provides redundancy for better tracking accuracy