How to Install The Facebook Tracking Pixel On Blogger

If you are on Facebook and are interested in tracking conversions to your blog from ads or post boosts, you are going to want to install the Facebook Pixel.   If you have never heard of the Facebook Pixel, you can read the quick summary directly from Facebook explaining how it works.

The problem is that the code they generate for users DOES NOT WORK directly on Blogger.

Installing the Facebook Pixel Tracking Code will give you an error that won’t all you to save the code in your template.   Luckily there is a work around that will convert the code to something more Blogger friendly.

How to Install The Facebook Pixel into a Blogger Blog

Step 1:  Create Facebook Pixel Base Code

Log into your Facebook Ads Manager and select Pixel from the drop down menu
Click on “Set Up Pixel” in the upper left



If you don’t have a pixel already, your screen may look a little different, but you still select “Set up Pixel": 
Choose “Copy and Paste the Code” as the method of installation from the pop up window.

Step 2: Convert Base Code to make it Blogger Friendly

Select the entire code (found in section 1.2) and paste it into the conversion box found HERE.
(Open this page in a new window since we will need to go back to you Facebook Ad Manager a little later)

Click on Convert.  Your code will look funny since all the javascript will be covered into a more ‘readable’ XML format for blogger.  But that is okay. That is what we want!

Step 3: Insert Base Code into your Blogger Template

Copy the converted code and open your theme HTML  Dashboard >> Theme >> Edit HTML
(If you haven’t backed up your template.. now is when you want to do it! Before you paste in anything new!)

Click INSIDE the html window and press Command-F (for “Find”)

In the upper right corner a search box should appear.  Type in </head>

When that is highlighted in your template, paste the converted code immediately BEFORE it.  


You can hit "Save Theme" at this point.  You shouldn’t get an error if you have inserted it correctly.

Step 4: Generate Event Code 

We now need to go back to the Facebook Pixel generator and select what parameter we actually want to track using an Event Code.  Click “Next”  and Step 2  (Install Event Code) will appear.



There are a lot of event triggers you can choose to track. The default is “search” which tracks when people use the search page.  I wanted to just track ever single page view, so I chose “View Content”

Step 5: Insert Event Code into your Blogger Template

Copy the code in that box and install it on the page (or if you want it to track on every page) in the template where you want it to track.  Paste it immediately AFTER the </head> section in your template.

So your final code will look like this:


There are a lot of other options for code placement and the Facebook Pixel installation tool is great at explaining where and what to install for those other options.

Step 6: Confirm your Pixel is Installed Correctly

It can take up to 20 minutes for your pixel to begin working.  If you have it installed correctly, Facebook should notifiy you when it is active.



If you check on the Pixel tracking page and it says “No information yet” it may mean that something is not working.  Otherwise, you should start to see Pixel fires as soon as your site gets traffic.

Now you are good to go!  

There is a lot of information you can collect via that pixel that can help with ad and audience targeting, however that is beyond the scope of this tutorial.  I just wanted to get your pixel up and running on Blogger!