Share Testing Facebook Pixel (CAPI) Events

If we go back to our Facebook pixel on Thiio, we’ll notice that below the Facebook CAPI token another switch exists with the label Facebook Test Mode Disabled, as you can imagine if we change the state of this switch to Enabled, it is going to help us testing our integration. Let’s turn the switch to enabled and another input will be displayed below the switch asking for a test code.

Open

In order to get the test code we have to jump back to our Facebook's Events Manager and click on the Test Events tab.

Open

Now that we’re on this tab. we’ll see a screen with the following information:

*Test Browser Events

*Test Server Events

We’ll first copy the Test Code and paste it on the Test Code input and save the changes.

After being saved our test code, it is required to add the URL of the website where our Facebook pixel is running. Let’s suppose that we have installed our pixel on the https://my-awesome-website.com/shop,

if we want to test our events we’ll have to add that address on the input labeled with Enter Website URL

After doing so, if we click on the Open Website button, a new tab will load the website URL. This page lists all the events that are being reported to Facebook from the browser and also from the server side.

In order to test these events we need to keep an eye on the Test Events tab from our Facebook’s events manager, every time one of the events is triggered it should be listed and very important the event must be Deduplicated.

Events Deduplication

Deduplication is a concept that facebook defines as a process for avoiding the duplication of events; it is important to remember that CAPI works together with the Facebook pixel, meaning that each event is going to be reported by the browser and also from the server side. If you want to know more about deduplication please refer to the Facebook’s official documentation.

Let’s explain how the deduplication works with the following example, imagine we have our Thiio shop and we visit the product listing page, after the page loads we select a product from the list and we add it to the cart.

That event from the user will trigger the wf_add_to_cart event and it’ll be reported to Facebook from our pixel in the browser first. If we take a look to ourt Test Events tab on Facebook’s panel, we should see the event listed, as we can see on the image below, the column Received From has a value of Browser, meaning that the event was reported from the browser by the Facebook pixel.

A few seconds later, the same Add to cart event will be reported again but now the Received From column will have a value of Server indicating that the event was received from the server as shown in the image below. Following Facebook’s CAPI best practices, every time a new event is reported, Thiio adds a Unique Event ID, this ID is will be the same for the event reported from the browser and from the server, this is how Facebook detects that the event has been sent twice and it will be deduplicated (counted only once).

When both events (from the browser & from the server) have been received, Facebook will deduplicate them as shown in the next image.

This process will be repeated for all the events reported to Facebook.