As a marketer, you know for sure that event tracking is very much essential to understand your audience behavior. The easy way to setup WooCommerce event tracking on GA4 (Google Analytics) & Meta (formerly Facebook) without the help of any expert is comprehensively explained step-by-step in this blog. By the end of this blog, you will learn to setup WooCommerce event tracking and send your event data by yourself to Google Analytics and Meta.
You have two ways to send the data – 1. Client-side & 2. Server-side
With iOS14+ update, GDPR, CCPA, etc., third-party cookie tracking got effected. Your ad campaign performance has dropped below the normal. Now, to tackle this, you should shift to server-side integration for your WooCommerce store.
6 Steps to Setup event tracking on your WooCommerce store using CustomerLabs CDP, the real-time CDP.
Step 1: Account setup
Setting up the No Code Event Tracker is very easy. First step is to sign up here – Register for Free. It just takes you a few clicks & only a few seconds to set up your account.
Step 2: Tracking code
Now, you will land up on the Connect Website section on the main home page.
Your website domain name will be directly visible. If you want to use a different URL, just enter that and click on save. After you click on save, copy the tracking code by clicking on the button right side to the code.
Now, simply paste your unique code into your WooCommerce store.
To do that go to admin panel of your WordPress, Appearance > Editor > Your website code appears here.
Paste your unique code under the <head tag> and click on save.
Step 3: Set up tracking in your WooCommerce website
Now, you are all set to record your actions using No Code Event Tracker.
Search for “CustomerLabs ActionRecorder” in the wordpress plugins or click here to get it.
Once you are into it, you will see the below screen.
You have to add the CustomerLabs App ID into the field. You will find this ID in the top right corner of your dashboard in the CustomerLabs App after you click on the Account Name.
Next, check all the user actions you want to be tracked such as Added to Cart, checkout made, removed from cart, etc., as shown below.
After you select save changes, all the events selected will be automatically tracked.
Now, if you want to send this event conversion tracking data to Google Ads / Analytics, all you have to do is, segment the audience and turn on the server-side sync for those segments.
When you want to track other events such as page view, added to Wishlist, etc., that are not covered above, you can use the No-code event tracker to track those events.
1. WooCommerce ‘Added to Wishlist’ event tracking
From the dashboard, click on the ‘Launch No Code Event Tracker’ button. This will redirect you to your connected website.
To track add to Wishlist event, choose action name as “Added to Wishlist”.
Now, let the action type be ‘On-Click’ and then click on Element Picker button. After that, hover the mouse over the Add to Wishlist button and click on it. This will track the user behavior of all the users who clicked on the Add to Wishlist button.
Next, you have to give the attributes so that you understand the details of the products added to Wishlist.
As soon as you click on Add Details, it displays Select Attribute type and the attribute value.
From the drop down select all the attributes you wanna track – product name, product ID, price, variant, quantity, coupon, brand, etc. After that for each attribute select the element picker and save it.
Then click on Next | Post-Action trigger.
If you want this action to be tracked across all the pages, select all pages from the drop down > click on Save > Click on Update Action and Save all the actions.
Step 4: Test No Code Event Tracker
The next step is to test if your events are being tracked. Your Action names and Action types will differ based on what you chose previously.
In order to test if it is working, open your WooCommerce store in the new window and click on the events which you just set for tracking.
Now, go back to CustomerLabs CDP dashboard and scroll down in the connect website section.
You will find Verify Event Data button. Click on it to see the data for all the events that you set up.
Click on ‘view data’. And there, go to the ‘recent data’ tab and you will find all the event data being tracked over there.
Step 5: WooCommerce Google Analytics Integration
To integrate your WooCommerce store with Google Analytics,
Simply click on the ‘send data to destination’
You will see the Connect GA4 button. Click on it.
You will be directed to the screen showing all our existing destinations you can connect with.
Click on ‘Google Analytics gtag’
You will see the below screen
Click on Enable
And then you will see the below screen
Click on Configuration Settings.
Enter your GA4 tracking ID.
Migrate to GA4 from Google Universal Analytics, if you have not migrated yet.
In order to get your Google Analytics Tracking code, Go to your Google Analytics and then go to settings in admin panel > Data Streams > Click on your website > Measurement ID. Your unique Tracking ID (measurement ID) will be displayed here.
To integrate Google Analytics with our No Code Event Tracker, you need to follow these steps.
1. Authenticate Google Analytics
Copy the Measurement ID you got from the above step in the website Tracking ID field.
Now, to authenticate Google Analytics, click on sign in with Google.
Check the two boxes shown to integrate fully.
After signing in, you will see the below screen.
Select your GA4 account which you want to integrate with to send the tracked events. Choose the GA4 web property.
You will get Authentication Successful in the Dashboard of configuration settings.
Click on Submit.
2. Enable GA4 Measurement Protocol
Turn on the push button to make it turn Green with On.
Paste the API Secret Key
(you can get the API secret key from Google Analytics using the steps displayed on the screen)
3. Enable User-ID tracking for anonymous users
4. Enable Enhanced Ecommerce
Click on Save Changes button and you will get changes saved notification.
Tada! You have now successfully integrated event tracking data of your WooCommerce store with Google Analytics (GA4).
Now, you could finally track all your events that have been sent to Analytics.
Step 6: Woocommerce Facebook Integration
You can implement Facebook Conversions API using CustomerLabs without a single line of code.
Simply click on the destinations in the left
You will be directed to the screen showing all our existing destinations you can connect with.
Click on ‘Facebook’
You will see the below screen
Click on Enable and you will find the below screen
Click on Configuration settings
Now, to authenticate your Facebook account seamlessly, click on Click Here, beside the Not Recommended Authentication.
You will be redirected to Facebook.
Next choose which account you would like to proceed. (The account which you will use CustomerLabs data to run ads)
Next step, choose the page you want to go with.
Then, select all (recommended) to proceed and you will be linked with CustomerLabs.
Next, you will be redirected to CustomerLabs
Choose the Ad Account and the Pixel
Click on Submit.
Next, toggle the Send data via server side button ON
Click on Save Changes.
In order to create a Meta tracking Pixel, Go to Meta Business Manager, select your business. Data Sources > Select Pixels > Click Add near search bar at the top > Give a name for your pixel > Put in website URL > Click Continue
Facebook Integration with your WooCommerce store is now complete. Now, you could finally track all your events that have been sent to Facebook.
