Complete Tracking for Shopify:
Facebook Pixel, GA4, Google Ads, and Remarketing
Client Background:
Clients needs to installed tracking tags on his Shopify website to get insights and optimize their online advertising efforts. They need to integrate Facebook Pixel, Google Analytics 4 Event, Google Ads Enhanced Conversion Tracking & Remarketing Tags to effectively track user interactions and optimize ad performance.
Challenges:
- This Shopify Store had a Data Layer enabled by Google & YouTube channel App. User information is not available on the data layer. There was also Checkout issue on website Checkout Event didn’t showing the Data Layer .
2. His website operates in 3 different languages.
Solution:
After a quick Zoom call to gather detailed requirements for his tracking project, I implemented a complete data layer using JavaScript with a unique event prefix to ensure that each event is separated for Google and YouTube channel app events.
I started from from scratch to set up his Tracking Ecosystem.
🟢Created Facebook pixel tag for Ecommerce
🟢Created Google Analytics ecommerce & Custom Event:
- View item List
- View item
- Add_to_cart
- View_cart
- Checkout
- Purchase
- Form Submit
- Outbound click
- Newsletter sing up & More….
🟢 Created Google Ads Conversion Tracking Tag
I use Google Tag Manager to manage the Conversion Tags /Scripts from a single interface.
I create a lot of variables to get accurate data from the Data layer. Also Created some Tags and triggers in Google Tag Manager.
Let’s Explore the full Tracking Ecosystem !
After adding the JavaScript code, I checked the Data Layer in GTM in-Built Preview mode to ensure every event was showing and contained data according to the GA4 schema.
I found the same event twice. One form Google & YouTube Chanel App and Another from the code i have added in the store. I added “arafat_” to my custom event to make it unique.
Checkout Event is Working perfectly with expected data.
arafat_purchase event contained user information with ecommerce data.
The Data Layer was working properly in Preview mode, confirming that the Data Layer implementation was correct.
I created the required variables from the Data Layer and modified some of them to the recommended format for Meta Advanced Matching.
Deployed Tags in GTM for Facebook Pixel, GA4 Event (Ecommerce & Custom), Google Ads Enhanced Conversion Tracking and Remarketing
Created a lots of Triggers to fire the tracking tags in different conditions.
According to Facebook’s official documentation for Advanced Matching, user data needs to be provided in the following Format.
After Enabling Data Layer, I got user data from website not in ideal format required for Advanced Matching.
🌟I use JavaScript to get the User data in Ideal Format mentioned in Official Document.
Facebook Pixel required a couple of parameters with Every Event || Official Document
Google Analytics 4 requires a few specific parameters with every event. I always follow the official documentation for recommended GA4 events to ensure accuracy and compliance.
Configured Google Ads Tag and send User data to Google for Enhanced Conversion.
I always use Manual Configuration to send User Provided to Google Ads.
To ensure accurate user data, I use variables created from the Data Layer
After testing and debugging all the tags, triggers, and variables in Preview mode multiple times, I published the container and made it live once everything was confirmed to be working perfectly.
A detailed Report of the entire process for future reference.