How to install the Facebook pixel on WordPress in the blink of an eye

With my teeny-tiny measurements – I'm 1 pixel high by 1 pixel wide – I go completely unnoticed.

So, yeah, I'm pretty damn short. But oh, how strong I am. Very, very strong!

I'm not giving you my self-portrait. The weirdo I'm talking about is the Facebook pixel.

If you don't use it yet, know that this is the tool to install urgently on your website if you advertise on Facebook and/or Instagram, and want to maximize your ROI (Return on Investment).

In this post, I will detail the procedure to follow, step by step. And I'll tell you all the secrets of this amazing specimen.

Now, here's the overview.

This post contains some affiliate links. If you purchase a service or a product using these links, WPMarmite will get a small commission. This rewards the research and writing work of the writers and it does not prevent us from being impartial. We're always honest for better and for worse!

Your best WordPress projects need the best host!

WPMarmite recommends Bluehost: great performance, great support. All you need for a great start.

Try Bluehost

What is the Facebook pixel?

It is an analytics tool that allows you to measure and optimize your Facebook ads, by giving you access to data related to the actions performed by visitors on your website (e.g. button clicks, conversions, page views, purchases etc.).

You automatically get free access to it as soon as you create an ad account on the world's #1 social network, which is also used by more than two billion people every month.

If we had to roughly compare, let's say it's a kind of Google Analytics specific to Facebook.

But let's take a concrete example to explain its usefulness. Let's imagine that you have a WooCommerce store on which you sell fans (yes, this post is published in the middle of summer, and it's hot).

The Facebook pixel will be triggered as soon as someone performs an action on your website (e.g. checking out the page of your number 1 sales fan).

You will then be able to send them a targeted ad on their Facebook or Instagram feed, to remind them that your great online store sells super-efficient-refreshing fans (and that it's time for them to proceed to checkout, if they haven't already).

You get the main idea: the goal, in this case, is to help you make more sales, and boost your conversions (carrying out a specific action by a visitor, such as downloading a PDF, for example).

Well, that's all well and good, but you have to ask yourself how does all this stuff work mechanically?

I'll give you the details right away.

In fact, the Facebook pixel is a piece of JavaScript code containing an image 1 pixel high by 1 pixel wide, hence its name.

Look, it looks like this:

I have provided you with the code corresponding to the said image so that you can understand.

Obviously, this little “snitch”, so to speak, is invisible to the naked eye. You can do the test by pasting the address of the image (which starts with https://www.facebook.com/tr? on the above screenshot) in a new tab of your browser: you won't see anything, blank page.

For the rest, just below, you'll need to have your eyes wide open.

An analysis tool to help you create better ads

I hope you have understood how our little spy tool works.

In order to make your mouth water a little bit more, you will immediately discover how it can help you create better ads, and what it can do for you.

To start, a little reminder. As Facebook explains:

Once you've set up the Facebook pixel, the pixel will fire when someone takes an action on your website. Examples of actions include adding an item to their shopping basket or making a purchase. The pixel receives these actions, or events, which you can view on your Facebook pixel page in Events Manager.

Source: Business Help Centre About Facebook pixel

Now you've got a lot of data on hand to analyze your visitors' behavior, and optimize your ads, of course.

This will allow you to:

Building similar audiences

Similar audiences, Facebook also calls them lookalike audiences.

Thanks to the data collected by the pixel, you will be able to reach people who have the same profile as your current visitors, and are therefore “likely to be interested in your business”.

This will allow you to target your ads more accurately, and you will also be able to reach an audience that has never been to your website before, broadening your prospect base.

Retargeting

Would you be interested in broadcasting an ad to someone who has already shown an initial interest in your product or service offer?

It is possible by retargeting. In this case, you will target the Internet user who has visited your website, or a particular page, but who has not completed the desired process.

Let's take the example of our online fan shop. Thanks to retargeting, you will be able to send an ad to the people who have added a fan to their Shopping Cart, but have not paid.

In short, you tell them: “Hey you, remember, you're almost done shopping! Now, all you have to do is provide your payment information. To do so, get back to my website, right here!”

Join the WPMarmite subscribers

Get the last WPMarmite posts (and also exclusive resources).

SUBSCRIBE NOW

Tracking your conversions

The Facebook pixel also lets you know what action a visitor has taken on your website after clicking on your ad.

This is called conversion, and it can refer to several things:

• Adding a product in a Shopping Cart.
• Purchasing a product.
• Filling out a form.
• Subscribing to your newsletter etc.

Thanks to the collected data, you will be able to measure your results, calculate your ROI (Return on Investment), and of course correct your modus operandi, if necessary.

For example, if your ad aims to make your visitor fill out a form, but the conversion rate seems low, maybe your form is badly designed and needs to be redesigned.

In short, the Facebook pixel allows you to measure the results of your ads and optimize them by allowing you to reach the “appropriate audience”, as Facebook says.

Who is involved?

Logically, the “priority” users of the Facebook pixel are the people who advertise on… Facebook (*).

If you haven't done this yet, but may be planning to do it someday, it may still be worthwhile for you to install this little piece of code.

Facebook will start collecting information about your visitors. And once you're ready to position yourself in the starting blocks, you'll have access to all the information you need to get off to a good start.

You now know what our famous pixel can bring you, and if you need it.

By the way, how to install the Facebook pixel on WordPress?

There are two ways of doing it: with or without you a plugin.

To start, find out in the next part how to do it with the help of the Pixel Caffeine plugin.

(*) Note: But also on Instagram, since this social network is the property of Facebook and its ads can be set from the Facebook Business Manager.

How to install the Facebook pixel on WordPress with the Pixel Caffeine plugin

In order to install the Facebook pixel on WordPress, you must first create a Facebook Ad account, if you do not already have one.

You can do this through the Facebook Business Manager Dashboard. This is a free platform to manage your advertising accounts, your Pro Pages etc. The social network explains how to do this on this page.

Next, you can go to the Ad Manager.

Click on the hamburger menu at the top left of the page, then Business Settings > Data Sources > Pixels.

Then, click on the blue + Add button.

A new window will then open and ask you to:

• Give your pixel a name, usually the name of your website. Please note that by default, you cannot add the Facebook pixel to multiple websites (it can only be used on one ad account). If that's not enough for you, Facebook still allows you to bypass this rule by setting up Business Manager, which we talked about earlier.
• Enter the URL of your website (optional).

Remember to click on the blue Continue button to move on.

If everything is ok, your pixel is automatically created. For the next steps, Facebook gives you the choice between installing your pixel now or later. We'll choose to set it up now.

Then, you will have three options:

• Connect a partner platform.
• Install the pixel code yourself, manually.
• Email instructions to a developer to take care of it for you.

If you choose Add code using a Partner Integration (i.e. WordPress), Facebook will suggest you to activate its own plugin called Official Facebook Pixel.

It may be perfectly suitable but it has several drawbacks:

• Its page on the official directory states that if you update it, it may be deactivated. You must therefore remember to check that everything is active in order not to lose data. Moreover, it is very badly rated (2 stars out of 5), which does not really inspire confidence.
• With it, you can't do anything from your WordPress Dashboard, which is not the case with Pixel Caffeine, which I'll introduce just below.

Note: if you can't see WordPress in the list, enlarge your window and it will appear at the bottom, like on the below screenshot.

Note: if, for a reason or another, you have had to interrupt your Facebook Pixel setup, don't worry! To get back at it, please follow this path from your Business Manager dashboard: (STEP 1) select your desired account on the top right dropdown menu (if you have more than one accounts) > click on the Go to Business Settings button OR on the See All in Business Settings button (see below, both buttons inside the red frames). (STEP 2) Another window will then open. From there, go to the left menu: Data Sources tab > Pixels > Open in Events Manager in the top right corner. (STEP 3) Another window opens from which you only have to click on the Continue Pixel Setup button > Use a partner button and carry on! 😉

For the purposes of this tutorial, we'll use a free plugin to install the Facebook pixel on WordPress. What's its name? Pixel Caffeine.

It will allow you to use some of the pixel features directly from your WordPress Dashboard, such as creating custom audiences, tracking conversions etc.

To install it, go to the administration of your WordPress website, and follow this path: Plugins > Add New.

Click on Install Now and then Activate (same button).

This will trigger the display of a Dashboard. Click the green Set up now button. This will automatically redirect you to the General settings tab.

Then you have two options:

• Add your Facebook pixel on WordPress manually.
• Let the plugin doing it on its own by logging into your Facebook account. We will opt for this solution because the plugin specifies that you will have access to all its options only by doing so.

Follow the instructions on the screen. In particular, you will be asked to choose the account associated with your pixel, and then click Apply.

Finally, remember to allow tracking data by clicking Enable, as shown in the box below. Then, remember to save by clicking on the Green Save button at the bottom of the page.

Congratulations, your Facebook pixel on WordPress is now installed. I'll show you how to check it in part V of this article.

For the settings of your ads, I advise you to use the Facebook Business Manager, which will be much more complete than Pixel Caffeine.

Nevertheless, the latter allows you to make some settings while staying on WordPress, which may suit you.

For example, you will be able to:

• Create a custom audience (Custom audiences tab).
• Monitor your conversions (Conversions/Events tab). For example, you'll be able to check if someone has visited a given page by entering the corresponding URL.
• Enable or disable the tracking of some very specific data (General Settings tab) such as tracking by custom post type, taxonomy etc.

Pixel Caffeine also allows you to activate the Facebook pixel on WooCommerce. You will be able to dynamically re-target your visitors with ads on Facebook or Instagram according to what they have visited on your website (product, category etc.).

Everything is OK with you? I bet you've dropped a big “Yes”, so let's move on!

If you don't want to install an extra plugin on your website and aren't afraid to get your hands dirty – you're welcome – you can also install your pixel manually.

That's the subject of the next part.

Speed up your website with WP Rocket

Turn your site into a rocket with the most powerful caching plugin recognized by WordPress experts.

Try WP Rocket

How to install the pixel manually?

To do this, go back to your Facebook ad account (in the Events Manager), and click on Continue Pixel Setup.

You'll see a window you've already seen. Choose Install code manually, then copy the pixel code (green button Copy Code).

Next, the most appropriate way to proceed is to paste the piece of code into the functions.php file of your child theme.

If you don't have a child theme yet, give me your little fingers, someone is going to get their knuckles rapped.

Seriously, there's nothing to be proud of! A child theme is fundamental. When updating your website, it allows you not to lose the changes previously made.

Parenthesis closed. Let's go back to our functions.php file.

This little secretive thing is located in your theme folder by following this path: wp-content > themes > name of your theme > functions.php.

If you use a child theme (well done!): copy and paste the functions.php file from your parent theme into your child theme folder.

Then open functions.php and add the code below at the end of the file. Remember to paste the Facebook pixel code instead of the text /* Pixel code here */, of course:

add_action('wp_head', 'wpm_add_fbpixel');
function wpm_add_fbpixel(){
?>
/* Pixel code here */
<?php
};

Save your file and you can chill, you're good to go. Phew, that went well!

Last technical check before enjoying your Facebook pixel on WordPress: check that it's working properly!

How do you know if your pixel works on WordPress?

To make sure it's working, go back to your Facebook window (the one where you manually retrieved the pixel code) in Step 4 (Send test traffic to your pixel).

Enter your website address and let the magic work. If everything is OK, a small green light with the word Active should appear.

For those who did not listen, or wanted to disobey by closing the window, voluntarily or not, you're going to get your knuckles rapped, once again…

More seriously, it is not a big deal at all! Facebook has a solution. It advises you to use a Chrome extension called Facebook Pixel Helper.

You'll find it by doing a search on your favorite browser, or by going to the Chrome Web Store.

When you add it to Google's browser, you'll see it appear in your toolbar.

Finish by going to your website and click on the relevant Chrome extension.

If it works, you should get this kind of message:

How to use your pixel: standard events and custom conversions

All the lights are green, your pixel is working? Perfect. Next, you have to ask yourself how to use your pixel and get the most out of it, right?

To guide you as best as possible, we will focus on the idea of an “event”, i.e. an action performed by a visitor on your website, which will trigger the Facebook pixel.

Standard events

As the famous social network explains:

Events are actions that happen on your website. Standard events are predefined by Facebook and can be used to log conversions, optimize for conversions and build audiences. 

Source: Business Help Centre Specifications for Facebook Pixel Standard Events

In total, there are 17 of them.

To collect data on a particular event, you will need to install the small piece of code corresponding to the desired action (e.g. add to cart, completed registration etc.) inside the base code of your Facebook pixel, on the page of your choice.

That's not the purpose of this article, so I won't give you a detailed tutorial.

However, to help you, I invite you to check out this page which explains how to proceed to use one or more standard events.

If you are using the Pixel Caffeine plugin, you can also do it through the Conversions/Events tab, without getting your hands dirty.

If you don't feel like you can handle the code, Facebook has another solution: custom conversions.

Custom Conversions

According to Facebook, they allow you to “set up standard events without additional code” by using, for example, a URL on your website to find out where a specific action has taken place.

To help you understand the difference between a standard event and a custom conversion, Facebook has prepared a small summary table for you:

To create a custom conversion, here's how it works.

What about GDPR compliance?

Among the many questions people have about the Facebook pixel, one that comes up frequently on the table:

Is it GDPR compliant?

That's quite a tricky question but we'll try to give you some answers.

The subject being technical, and given that it is not our job, we can only advise you to get in touch with specialists in the field (lawyers, for example).

Let's start by briefly coming back to what the GDPR is. It is the acronym for the General Data Protection Regulation, a European regulation that came into force on May 25, 2018.

Its purpose? To ensure that every individual has control and safety of the personal data they disseminate while browsing the web.

That's it for the general functioning. Back to Facebook. The company created by Marc Zuckerberg claims that it is GDPR compliant, even though several complaints and lawsuits have been filed against the company.

Then it's on your side. Or rather on your WordPress website.

In fact, you must “obtain the individual's prior consent to store and access cookies or other information on their device,” as Facebook says.

That's where it gets a little messy, because you hear everything and anything on it.

To get a clearer picture, go to the European Commission website, to which Facebook redirects you when it comes to accessing the specific GDPR regulations for each country.

If you go to the relevant page, you will find useful info. Also, check out all the details you need to know about GDPR compliance.

I advise you to check out the international dimension of data protection page where you'll find more info to be GDPR compliant.

They will give you a lot of other tips to make the right modifications on your website.

You can take a deep breath again. You're coming to the end of this post. All we have to do now is summarize everything you've learned.

Build your website with Elementor

Design easily the look and feel of your WordPress website with the famous page builder. Try Elementor

Try Elementor

So, pixel or no pixel?

Don't miss it: it's quick to integrate, and you now know how to add it to your website manually, or using a plugin.

From now on, I'll leave it up to you. Do you plan to use this little piece of code soon?

Or if you're already using it, how did you do about it?

Use the comments below to share your feedback and other tips.

Receive the next posts for free and access exclusive resources. More than 40,000 people have done it, why not you?

Register

About the author

Thibaut (WPMarmite)

Content manager and independent copywriter, I help my clients to develop their online presence. Freelance since 2011 and former sports journalist, I am passionate about webmarketing, WordPress and SEO on the professional side. On a personal level, I love series, reading and sports. I'm a huge football fan.