[Step-by-Step Guide] How to Set Up Facebook Server-Side Data Tracking (a.k.a Conversion API) in Google Tag Manager

Remember when Apple deployed its iOS 14.5 update and messed up Facebook advertising for many businesses? From big-level CMOs to entrepreneurs, marketing managers, and ad managers – everybody took a hit. Some lowered their Facebook advertising budgets. Others stopped advertising altogether. It was complete and utter chaos. For those looking to get more info on what the iOS 14.5 update meant, we covered the subject in this article a while back.

Meanwhile, let’s not lose sight of why you’re here – you’re probably looking for new ways to optimize your ad targeting, decrease CPA, and reduce the 14.5 iOS update on measuring results. 

Yes, everything mentioned above can be done. Implementing the Facebook Conversion API on top of the current client-side setup is all it takes. Once you do so, you should see an increase in Facebook data accuracy of around 15-20%. That ought to fill the gap left by the iOS 14.5 deployment.

Failing to implement Conversion API means that you’re not only ignoring the best practice the tool itself recommends but, more importantly, not giving this platform a chance to bring you quality conversions at fair costs.

With more data to feed Facebook, a decrease in the cost per acquisition should soon follow. As a result, don’t be surprised if you start hitting the target conversion costs from before the iOS 14.5 update.  

However, the Facebook Conversion API is useful to so many different companies and job roles for so many reasons. 

It’s useful to the marketer who notices the limitations of a plugin used for tracking Facebook events. It’s useful to the company missing a proper overview of Facebook tracking. It’s especially useful for a company that wants proper Facebook tracking in place (who doesn’t?) but lacks development capabilities. 

And with what we’re about to show you, it’ll also be useful to the company wanting to move away from the old-fashioned hard-coded implementation to the more flexible Google Tag Manager option.

Here’s the beauty of GTM – it requires very little coding knowledge. This makes adding marketing or analytics pixels to your website waaay easier. You’ll see. 

Compare that to Content Management Systems like WordPress or Shopify where plugins make it super hard to customize pixels to your needs. If you’re a data specialist or technical marketer working for a company where developers often optimize other website features, you know exactly what we’re talking about. 

However, by using Google Tag Manager, you won’t need any help from developers. And the customization options are virtually limitless. All this works in your favor by offering you a flexible and easy-to-manage setup. 

This is even more obvious in reference to the Facebook pixel. In this case, the special benefits you get include: 

1. The simplicity of adding multiple Facebook pixels to one website using a single configuration
2. The smooth transition to the Facebook Conversion API 

Now here’s the thing. Things will get a bit technical from here on out. So, if you’re reading this as a CMO, or a marketing manager, we recommend forwarding this article to one of your data-tracking specialists or developers. 

Put on your working hats, because we’re about to embark on a discovery journey that will cover topics such as: 

• The Facebook pixel –  How to pick the best option between client-side tracking and server-side tracking
• The benefits of adding Facebook pixels through Google Tag Manager
• Prerequisites
• Step 1: Google Tag Manager client-side configuration
• Step 2: Sending data to the server-side Google Tag Manager container
• Step 3: Google Tag Manager server-side configuration
• Adding multiple Facebook Pixels

The Facebook pixel – How to Pick the Best Option Between Client-Side Tracking and Server-Side Tracking

The Facebook pixel is a powerful tool that enables you to track user behavior and measure your ads’ effectiveness. With this tool in your arsenal, you can gain valuable insights into your audience and optimize your ad campaigns for maximum results. But here’s the catch – when it comes to tracking, you gotta choose between client-side tracking and server-side tracking. Both options have their pros and cons. 

However, to make full use of all the benefits of the Facebook pixel, the configuration should consist of both parts:

1. The Facebook browser pixel managed client-side
   &
2. The Facebook Conversion API managed server-side

Facebook recommends configuring both for your website events. This allows for collecting as much data as possible about your website visitors without bypassing data-sharing policies or privacy rules.

If you’re planning to enable both the browser pixel and the Conversion API on Facebook, then there’s one crucial thing you need to keep in mind. Sending the same user interactions through both channels could result in inflated numbers, which we definitely want to avoid. 

To prevent this from happening, Facebook has a deduplication mechanism in place that uses several parameters to identify duplicate events. And here’s where things get interesting – the “Facebook Event ID” parameter is the key to accurate deduplication. When configuring your Facebook events via Google Tag Manager, use this parameter to ensure it’s the same for both the browser pixel and the Conversion API.

By doing so, you can rest assured that your events will be deduplicated and your numbers will be spot-on. Simple is accurate.

The benefits of adding Facebook pixels through Google Tag Manager

Google Tag Manager is a game-changer in implementing the Facebook pixel. Not only does it make the process simpler and more streamlined, but it also offers a host of benefits that you won’t want to miss out on. We’re talking about benefits such as:

• Not needing a developer
• The easy maintenance of pixels in Google Tag Manager through a template
• The super-simple way of adding more Facebook pixels 
• Testing and QAing before launching your implementation is now accessible to all
• Having clarity and a single point to go to for all pixel tracking added to your website.

Let’s take a more in-depth look at each one of these benefits. 

Not needing a developer

We’ll start with the most interesting one: you don’t need to ask a developer to add extra JavaScript to your website. Yes, you’ve read that correctly. You won’t even have to reach out to your developer anytime a small update is needed. Like never ever. As a marketeer or technical specialist you’ll be able to manage all this yourself in the Google Tag Manager interface. 

Ok-ok, maybe you’ll need a developer to add the GTM script to your website. But once you do that, you’ll be on your own. And we’re not even going to mention the fact that if you’re using a well-known Content Management System, you’ll discover some super-easy-to-use plugins that will help you add Google Tag Manager yourself. 

Ah, the sweet taste of independence… 

Easy maintenance

We’re dead serious about this. Adding and maintaining Facebook pixels through Google Tag Manager is a piece of cake. No JavaScript knowledge is needed since there is a premade template you can use. More on that in the following sections. 

Add more pixels

The same template mentioned above also allows adding multiple Facebook pixels to your website easily. And that’s something more and more companies require. Unfortunately, you won’t find a plugin for this inside most Content Management Systems. Another win for GTM.

Simple QA

Eat your heart out, you super-busy QA specialists – we can now debug an implementation ourselves. Yes, Google Tag Manager makes it very easy to test your implementation or changes. It offers a debug view for both client and server-side tracking, to check if your changes are working before you launch the actual pixel for your website visitor.

Clarity and Overview

Finally, it’s worth noting that by implementing your Facebook pixel(s) in Google Tag Manager, you’ll have a centralized view of all the tracking codes added to your website. This is particularly beneficial if you also use Google Tag Manager to add other pixels to your site, which we highly recommend. By having all your tracking codes in one place, you’ll be able to manage them more efficiently and gain a better understanding of how different pixels interact with each other. So if you want to streamline your tracking and simplify your life, make sure to add all your pixels to Google Tag Manager.

Now, who’s ready to move on to the ‘How to’ section of this article? Let’s do it.

Prerequisites

If you’re looking to take your Facebook dynamic remarketing game to the next level, there’s one crucial thing you need to have in place – a data layer that contains all your product and order information. 

Don’t have this set up yet? Don’t worry; most content management systems like WordPress and Shopify offer plugins that automatically add the required information to your data layer. 

Now let’s dive into how to implement the Facebook pixel. There are three key parts to this process. First, you’ll need to set up the client-side configuration to enable the regular Facebook pixel(s) on your website. Second, you’ll need to send data to the server-side container. And third, you’ll need to configure the server side to enable the Facebook Conversion API. So let’s get started on maximizing your Facebook advertising potential!

Step 1: Google Tag Manager client-side configuration

Alright, here we are. The nitty-gritty of configuring the Facebook pixel through Google Tag Manager.

First things first, we’ll need to set up the client-side container in Google Tag Manager. To make your life easier, we highly recommend downloading the Facebook pixel custom template from the Google Tag Manager template gallery. 

Once downloaded, it’s time to configure all the required inputs for the Facebook pixel. This includes adding the regular Facebook pixel and configuring variables, triggers, and tags. 

To make things even more practical, we’ll walk you through setting up a regular Pageview event. And if you’re feeling adventurous, check out our more complex Purchase event setup by clicking on the button from the box to the right of your screen.

Meanwhile, if you’ve been reading our articles, you know we’re all about making things as easy and practical as possible. That being said, let’s get this Facebook pixel set up and start tracking those conversions!

Variable configuration

Let’s discuss variables – the key ingredient to setting up your Facebook pixel through Google Tag Manager. The most crucial variable to add is the one that defines a unique event ID, which allows Facebook to deduplicate browser and Conversion API events. Luckily, Google Tag Manager has custom variable templates you can download and enable to make this process a breeze. We highly recommend you download our top pick here. 

The Unique Event ID is the only variable that needs to be configured for any event you send to Facebook. However, you can configure other variables for the Facebook events you want to track based on your specific requirements. For instance, you can extract variables for product SKUs, order value, hashed email addresses (with proper consent, of course), and search queries from website searches. 

If you’re looking for a more in-depth look at configuring some of the variables mentioned above, our free content upgrade is a must. Just hit that sticky button that keeps following you on the right of the screen, add your email address, and we’ll send it to your inbox before you can say ‘tracking’. 

With these variables in place, you’ll be able to track your Facebook events with ease and accuracy.

Trigger configuration

Now, let’s move on to configuring triggers for your different pixels. For our example Pageview event, you can easily use the Page View trigger of GTM without any special arrangements. However, depending on what you intend to track, this may vary. You’ll need a separate trigger for each event you want to track for Facebook. 

For other types of events, such as e-commerce interactions like adding a product to the cart, viewing a product detail page, or completing an order, you’ll require specific triggers. Likewise, if you want to track the usage of the search functionality on your website, you’ll need to set up a dedicated trigger for that. By configuring your triggers correctly, you can ensure that the events you want to track are accurately recorded and reported in your Facebook pixel.

To help you further set up more complex events like Purchases, we’ve created a free content upgrade that walks you through the setup step-by-step. Download it from the end of this article or by clicking the button on the box found on the right side of your screen.   

Tag configuration

Let’s go through the final step of the setup process – creating tags for your Facebook pixels. 

In our example, we’ll use the Pageview event. First, create a new tag and select the “Facebook Pixel” tag type you downloaded earlier. If you have multiple events to track, create a new tag for each one using the same tag type.

The Facebook pixel tag type offers you a few configuration options, so go ahead and follow the next steps:

[a] Add your Facebook pixel ID(s) from your Meta Business Suite. If you have multiple IDs, separate them with a comma (more on this in Step 3).

The Facebook pixel ID(s) can be found under Events Manager > Data Sources > Settings > Pixel ID.

[b] Make sure you select the correct event name, in this case “Pageview”.

[c] Use the Unique Event ID you created in the previous step to deduplicate Facebook browser and Conversion API events.

[d] Select the appropriate trigger for the tag.

Depending on the type of event and tag, you can also add additional event properties such as e-commerce or user details.

If you’re looking for a more complex setup for Purchase Events, make sure you download our content upgrade. It’s totally free, and you can get your hands on it by clicking the button from the right of your screen or at the bottom of the article. 

Great! You’re all set on the client side. Now let’s shift our attention to the server side.

Step 2: Sending data to the server-side Google Tag Manager container

Now, how do you send data from a client-side to a server-side Google Tag Manager container? The easiest way to do so is by setting up a special GA4 configuration tag. This tag is important for facilitating communication between the client and server.

Below is an example of what this tag may look like.

To ensure successful communication between client-side and server-side Google Tag Manager containers, it’s crucial to check the “Send to a server container” checkbox and input the accurate server-side container URL.

Next, navigate to the “Fields to Set” section and add the “event_id” parameter. Assign the Unique Event ID you created earlier as the value for this parameter.

Step 3: Google Tag Manager server-side configuration

To complete the setup, you must configure your Google Tag Manager server-side container. If you haven’t created one yet, you can follow the instructions in this Google support article to get started.

The server-side configuration involves these steps:

1. Configuring a server-side client
2. Configuring a server-side trigger
3. Configuring the Facebook Conversion API tag

Don’t worry, we’ll walk you through each and every one. 

Server-side client configuration

When you send data from a client-side container to a server-side container, the server-side container uses “Clients” to receive the data. The GA4 client is automatically enabled in the server-side Google Tag Manager container and is responsible for receiving data from the GA4 configuration tag set up in the previous step. 

You don’t need to customize the GA4 client in any way, as it is already set up to receive the data. You can learn more about this topic by visiting this link.

Server-side trigger configuration

Similar to client-side containers, server-side containers also utilize triggers that work in a similar fashion. You can configure a single trigger for your Facebook Conversion API tag using regular expressions. This trigger should be activated for all Facebook events you track via the browser pixel.

For instance, in the example of the Pageview event, the server-side GTM trigger should be configured to trigger when the GA4 client receives the GA4 page_view event from the client-side container.

Server-side tag configuration

It’s time to piece it all together. To do that, you need to configure the Facebook Conversion API tag in the server-side container. Each pixel needs one Facebook CAPI tag. 

To make things easier, we recommend downloading a custom tag template from the template gallery. Our preferred one is the Conversions API tag by facebookincubator. Once you’ve downloaded your template, you’ll need to configure the tag with the IDs below:

1. The Facebook pixel ID – should be the same as the one used for the browser pixel.
2. The API access token – you can retrieve it from the Meta Business Suite.

To retrieve the API access token, go to Events Manager > Data Sources > Settings > Conversions API > Set up manually > Get Started.

Finally, add the trigger configured earlier, and that’s it for the Facebook Conversion API. You will have only one Facebook CAPI tag in your server-side GTM container, which will be used for all your events.

Adding multiple Facebook pixels to the server-side container

Now, what if you’re using multiple Facebook Pixel IDs? Not to worry, we’ve got a simple solution for you too. Our suggestion is to create a duplicate of the Facebook Conversion API tag and make the necessary updates. Simply go ahead and duplicate the tag, and then update the Facebook Pixel ID and API access token fields to match the new Pixel ID. This way, you can use one server-side container and still track events across multiple pixels. Easy peasy! 

A quick heads-up – don’t forget to update the Facebook Pixel tag you previously configured. You just need to create a comma-separated list and add the second Facebook Pixel ID. You can see where exactly to add it in the screenshot below.

Once you’ve completed all the previous steps and ensured everything works properly, it’s time to publish both the client and server-side GTM containers. From now on, data will be collected for Facebook, and you can enjoy a scalable solution.

If you’re looking to take your Facebook ad game to the next level and want to find out how to implement advanced Facebook events – such as the one for measuring successful transactions – then we have something special for you. We’ve assembled a free guide to walk you through the process step-by-step. All you have to do is click the button from the right of your screen or from the bottom of this article, add your email address, and we’ll send it straight to your inbox. The way we see it, it’s an absolute must-have.  

Final Thoughts

Implementing Facebook event tracking and Conversion API can greatly enhance your ability to measure and tinker with your Facebook ad campaigns. By accurately tracking user behavior on your website and sending that data to Facebook, you can optimize your ad campaigns and improve your return on ad spend.

Using Google Tag Manager to set up these tracking tools streamlines the process and ensures the data you collect is accurate and comprehensive. Remember to configure your client- and server-side containers carefully, use triggers to specify when events should be tracked, and take advantage of the Facebook Conversion API tag template to simplify your setup. 

And if you want to go beyond the basics, don’t forget to download our free guide on how to implement advanced Facebook events. 

With these tools and best practices in place, you’ll be well-equipped to understand the impact of your Facebook ads and optimize your campaigns for maximum ROI.