How To Install The Facebook Pixel: A Step-By-Step Guide

You’re getting started with Facebook Ads—congratulations! You've made a smart decision.

But you’ve been told to install the Facebook Pixel and you’re not 100% sure how to do this or why you need to. No problem—this blog will provide a detailed guide to installing the Facebook Pixel. Our follow up blog will cover the how to use and optimize with the Facebook Pixel.

What is the Facebook Pixel?

The Facebook Pixel was launched at the end of 2015 to combine the functionalities of the old Conversion Tracking Pixel and Custom Audience Pixel (which will no longer work from February 2017) and also provide some new and improved functionality.

The Pixel is a snippet of Javascript that you add to your website’s code. But it’s not as complicated as it sounds. At a basic level it tracks every page view on your website by a Facebook user. This allows you to:

(i) Track specific actions and conversions on your website.

(ii) Build custom audience lists to run campaigns retargeting users of your website.

Why is the Facebook Pixel important?

Tracking conversions allows you to measure the performance of each and every Facebook campaign, ad set and ad you are running by the website actions that matter to you. Within this you’ll be able to breakdown the data to understand the demographics, locations, devices and times that are driving your conversions.

At a basic level, this will allow you to manually dive into your data to understand how, who and where your conversions are coming from, ensuring you can target your ad spend on the areas that will provide the best return.

At an advanced level—using a platform like Adgo—this will allow you to automate the optimization of your bidding and targeting towards multiple goals that are important to your business to improve your results in real time.

How does the Facebook Pixel work?

The Javascript snippet is inserted into every page of your website. When a user visits a webpage and a new URL loads, the code is fired and a visit to that page registered by Facebook. In addition the Facebook Pixel also allows you to record specific actions that users take on a webpage—such as the click of a button—in a similar way to Google Analytics. Between these two functionalities you will be able to track all Facebook users that visit your website and record specific actions they take in order to track conversions.

How to install the Facebook Pixel

Creating the Pixel

Go to the Facebook Ads Manager. Click on the “Pixels” menu item that appears underneath the drop down menu in the top left corner of the screen.

Click on the green “Create a Pixel” button on the setup screen. Enter a name for your Pixel in the pop up box and click “Create Pixel”.

That’s it. You’ve created your Pixel! Click “Install Pixel Now” to add it to your website.

Adding the Pixel to your website

You’ll be presented with a screen that looks something like the following. This is the snippet of code you need to install on your website to track pageviews, referred to as the Base Code.

The easiest way to install the Facebook Pixel on your website is to you use Google Tag Manager. This allows you to easily edit the code snippets you have on your website without having to do so by directly editing the HTML. Otherwise you’ll have to directly edit the HTML files on your website, which may require the help of your web designer or developer.

This code snippet needs to be placed between the HTML <head></head> tags on every page of your website. But wait! This Base Code snippet currently only tracks pageviews on your website and you also want to track conversions.

How to set up conversion tracking

There are two ways to track conversions: Standard Events and Custom Conversions. We recommend using Custom Conversions as they’re easier to set up (requiring no changes to the above Base Code snippet) and also more flexible. But we’ll be showing you both ways.

Using Standard Events

Standard Events are a collection of common website conversions that Facebook has created. They are additional snippets of code you add to your website that fire when a specific event takes place.

Facebook’s Standard Events are:

Facebook’s Standard Events can be added to your website using two methods: On Page Load and On InLine Action.

On Page Load Standard Events

On Page Load Standard Events fire when a URL with this extra bit of code is loaded. This means that to record actions such as form submits and purchases there needs to be a specific webpage that only people that have performed that action will access, such as a Thank You page. The extra line of unique code will then be added on this Thank You page and will record the users who visit it (and therefore have performed the desired action to get there).

As an example, on the Thank You page for a completed registration, the code would look as follows (where ‘<EVENT_NAME>’ is ‘CompleteRegistration’), with the additional line for the Standard Event highlighted in blue:

InLine Action Standard Events

InLine Action Standard Events fire when a specific action—such as a button click or form submit—takes place on a web page. These are useful when the action you wish to monitor doesn’t trigger a new page to be loaded.

As an example, if someone adds an item to a shopping cart on your website, but this doesn’t send them to a new web page (and therefore no new URL is loaded) you can record this action by using an InLine Action that fires when someone clicks the Add To Cart button. In this case you need to add the standard event code to the HTML button element as below:

Creating Custom Conversions

Custom Conversions allow you to track conversions on your website when a new page is loaded, as with On Page Load Standard Events. But they only require you to add the Base Code to your website, no additional snippets are needed, as they work based on URL rules.

You get the flexibility to create any conversions you’d like with your own naming conventions that match those used within your company. You can create up to 40 custom conversions—this means, for example, you can create conversions with different names for different lead forms on your website (therefore not bundling them all underneath the Standard Event’s Complete Registration conversion).

To create Custom Conversions navigate to the “Custom Conversions” menu item underneath the Measure & Report tab. This will be under the menu accessed at the top left corner of your screen:

Click on the green (or blue) “Create Custom Conversions” button. Enter the the website URL that a user will visit to complete the conversion. Then choose a Standard Event category that most closely matches the type of action you are tracking.

Finally, give your Custom Conversion a descriptive name that makes sense to you.

Click the “Create” button and you’re done—you’ve created your first Custom Conversion! You don’t need to make any edits to the Base Code that you add to your website.

Checking your Pixel is installed correctly

Once you’ve installed the Facebook Pixel on your website, you need to check it is working correctly. The easiest way to do this is to install the Google Chrome extension Facebook Pixel Helper.

Once it’s installed simply navigate to your website and click the extension icon. The drop down will give you the details of the Facebook Pixel and Events or Conversions that are working (or not) on that page.

Using and Optimizing the Facebook Pixel

The Facebook Pixel you created will be automatically assigned to all campaigns you create. So you don’t need to worry about assigning it (as needed to be done with the old pixels).

But you do need to assign conversions you wish to optimize for to your campaigns. Alongside creating different audience lists that you can market to, this is where the real power of the Facebook Pixel is born.

To find out how to do this read our follow up blog:

How To Use The Facebook Pixel: Conversion Tracking And Optimization