Add Facebook Pixel to Your Website using Google Tag Manager

How to add Facebook Pixel on your website using GTM

Facebook is the biggest social media platform out there, with over 2.7 billion users worldwide in 2021. Given it’s sheer size, Facebook following encompasses all walks of life, so if social diversity is what you are looking for, Facebook is the way to go.

Facebook also controls other subsidiaries like: Instagram, WhatsApp, Facebook Messenger, etc., increasing the platform’s reach even more. If you either need wide reach or specific targeting you should give Facebook ads a try!

The Facebook advertising platform offers a wide range of advertising features, placements, ad types and targeting capabilities through its platform.

In the light of its past events, including Cambridge Analytica and others, Facebook lost some of its shine and glory as the leader of all the social media platforms. Although you might not like Facebook actions you cannot argue with its potential for advertising. Facebook ecosystem reaches far and wide and it gives you the access to some very powerful targeting criteria not available (or not as reliable) in other advertising platforms.

This article continues the Google Tag Manager series of articles. In the last one, we’ve discovered how to implement Google Ads remarketing tag and looked over the benefits of using remarketing ads. Do make sure you check it out to get a better understanding of remarketing ads!

What is Facebook Pixel?

Let’s hear it from Facebook themselves: “The Facebook pixel is an analytics tool that allows you to measure the effectiveness of your advertising by understanding the actions people take on your website.” (Source)

Facebook Pixel Anatomy

Basically the pixel is a snippet of JavaScript code as the one shown below. Keep in mind that every Facebook Pixel code contains a specific ID which is swapped below with “____________”. If you want to implement the code on your website follow the steps below, do not implement the text given here as an example.

<!– Facebook Pixel Code –>
<script>
!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version=’2.0′;
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window, document,’script’,
‘https://connect.facebook.net/en_US/fbevents.js’);
fbq(‘init’, ‘____________’);
fbq(‘track’, ‘PageView’);
</script>
<noscript><img height=”1″ width=”1″ style=”display:none”
src=”https://www.facebook.com/tr?id=____________&ev=PageView&noscript=1″
/></noscript>
<!– End Facebook Pixel Code –>

If we were to analyze the code we’ll see two things: 

  1. The bulk part of the code it’s the part responsible for the initiation of the facebook pixel code.

The code marked with RED above it’s the event part where events, like the most fundamental one (PageView) is tracked.

The event section of the code allows you to track both standard and custom events. We will take a deep dive in the marvelous world of Facebook events in a future article. If you want to take a sneak peak at the world of events I would recommend checking out the Facebook standard events list. The list will help you get acquainted with all the available standard events for when we will try to implement them with GTM as well. 

Did you know that you don’t have to go through all the hustle of understanding all those technical details and implementing the code yourself? Hire me and let me help you develop the tracking architecture and advertising strategy for your business!

Why it’s important to add Facebook pixel on your website

Facebook pixel has many functionalities, we will analyze four of the most important below.

Facebook Analytics

If you are familiar with Google Analytics already it will be a breeze to understand Facebook Analytics. It’s a robust tool that helps you better understand your audience, where it comes from and much more! 

The data collected by the pixel helps to populate reports with data about pages visited by the users, time spent on website and specific web pages and create funnels based on this data. 

Facebook Analytics also gives you insights about your audience based on Facebook proprietary data (the data about its users) like age, gender, geographical, etc. 

You might wonder why you would need this if you already use Google Analytics. Well, in a world where data is king you will need to firstly get all the data you can, analyze it and make decisions based on it (aka. data driven marketing).

If you want to learn more about Facebook Analytics I recommend you to visit Facebook’s website and read everything about Facebook Analytics features.

Remarketing Audiences

In my last article about how to setup and install Google Ads Remarketing we’ve looked at what remarketing audiences are and how powerful they are. If you don’t want to read the full article I recommend you to watch the complementary video which has only 4 minutes. 

Long story short remarketing audiences are hugely important and can be a game changer for your online strategies. If you’ve ever been targeted with one of the products that you have added in our cart and decided to finally buy it, you already felt the power of those ads on your skin. 

One of the components of the remarketing ads are remarketing audiences and Facebook offers a robust mechanism for the creation of such audiences.

Creation of Lookalike audiences

You know what’s better than an audience of past clients? A audience with people that share similar traits with them! 

Sounds like it’s too good to be true? Well it is… NOO… don’t leave, I’m just joking. They are REAL, Facebook actually gives you the opportunity to create similar or lookalike audiences based on existing website audiences. The process is automatic, but Facebook gives you the ability to control how “similar” the audience is, from 1% (closest) to 10% (broadest).  

I encourage you to go into your Facebook account and play with those, they can be very powerful tools for prospecting new clients and enlarging your upper funnel. I will also help you better leverage the power of those audiences by giving you some advanced strategies on how to use them in a future article.

Creation of Custom Conversions

Conversions might not entice you that much at start, but they are essential for your digital marketing wellbeing. You might be tempted or even overwhelmed when seeing the vast amounts of metrics available in each advertising platform, but be warned, not all of them are equally important. 

I don’t need to tell you that the business fundamentals are the key to a successful business. Making sure you track those fundamentals in your digital platforms allows you to see how much value the platform delivers to you. Also, you will be able to calculate metrics like cost per conversion, conversion rate, ROAS and more.

For now you will have to know that creating custom conversions in Facebook depends on the Facebook pixel being implemented in your website. 

How to add Facebook Pixel on your website using GTM

For this implementation you will require the following prerequisites:

  • A Google Tag Manager account

  • A Facebook Pixel (if you don’t have a pixel yet, watch the video ⬇ below, it will guide you to the process)

The steps:

  1. Navigate to business manager: https://business.facebook.com/ (select the proper account if you have access to multiple accounts)
  2. From your menu icon select “Events Manager”
  3. Select the pixel you would like to install on your website from the list
  4. Click on “Add events” -> From a New Website
  5. From the newly opened screen click “Install code manually” and then “Copy Code”
  6. Open Google Tag Manager
  7. Navigate to “Tags” and click “New”
  8. Give your tag a name, I would recommend “FB – Base Code”
  9. Click the Tag Configuration and select “Custom HTML”, now paste the code copied at point 5
  10. Click the Trigger and select “All Pages”
  11. Your tag configuration is done, click “Save”
  12. To publish your implementation click “Submit” and then “Publish”

Congratulations! Now you have successfully installed Facebook Pixel on your website. 

To make sure everything is working fine and registering correctly you should check your implementation. In order to help you with this I have added a bonus fact below, follow it to check your Facebook Pixel!

Bonus Tip

Because I do appreciate the time you took to go through this article I will give you a bonus fact that will help you debug your Facebook Pixel implementation. 

 

Facebook Pixel Helper is a free tool but very powerful tool that will allow you to see if you have implemented the code properly. Also the Pixel helper allows you to see what events are registered and send to Facebook to be recorded. 

You can read more about the Facebook Pixel Helper by visiting the Facebook documentation for it. Also, you can download the tool for free by visiting the following link: Facebook Pixel Helper – Chrome Extension.

Andrei Oancea