Friday, February 24, 2017

6 Ways to Add the Facebook Pixel to Your Website

You hopefully know by now that the Facebook pixel is importantit’s really freaking important. It’s the Facebook pixel that allows you to create powerful audiences for ad targeting, run dynamic ads, track conversions, and optimize for conversions.

Many marketers remain slow to add the pixel — or add it correctly. The most common reason why is intimidation. They assume the process is complicated and overly technical.

While the pixel can get technical (particularly concerning standard events and dynamic ads), it is extremely simple for applying it for its core utility.

Let’s take a closer look at several different methods that allow you to install the pixel easily and properly today…

[NOTE: While there are links to products below (some are free, some are premium), none of the links are affiliate links. This is a list of options and is not meant to be a recommendation or testimonial.]

Locate Your Pixel

Before we get to how you install the pixel, let’s make sure you can locate that pixel in the first place.

First, go to the Pixels page in your Business Manager. If you haven’t set up your pixel yet, it will look like this…

Facebook Pixel

Click on the green “Set Up Pixel” button.

If you had previously created a pixel but you need to find it to install it again, click the gray “Set Up Pixel” button at the top.

Facebook Pixel

What you click on here will depend on how your website is set up.

Facebook Pixel

For now, though, we’re only concerned about accessing the pixel. So click on the second option, “Copy and Paste the Code.”

Within 1.2, you’ll see your pixel code…

Facebook Pixel

The number shown twice in blue is the unique pixel ID for your ad account. The example above is for a test account.

1. WordPress Theme Settings

Let’s first assume you are on a self-hosted WordPress site. If that’s the case, you have plenty of options. In fact, maybe too many options for me to know exactly how you should do it.

The main thing we want to look for is a place to inject code before the closing HEAD tag in the template of your website. That way, this code (your pixel) will appear on every single page of your site. That’s the goal.

One common place to do this is in your theme settings. Since there are thousands of different themes, I can’t say that this is the case for all themes. But it is for mine, and I use Genesis Framework.

At the bottom of my theme settings is a section for “Header and Footer Scripts.” Anything placed in the Header Scripts box will “output immediately before the closing tag in the document source.”

Facebook Pixel

That’s exactly what we want. So paste the entire pixel code here and click “Save.”

2. WordPress Plugins

Installing your pixel on every page of your website is the base minimum what needs to be done. If you can do this with #1, you’ll be able to create audiences of people who visit your website and create Custom Conversions to track and optimize for conversions.

But there are a few plugins (probably dozens and dozens of them) that take this a step further. Let’s take a look at three of them that I’ve tried before…

Pixel Caffeine

Pixel Caffeine is a new, free plugin put out by Ad Espresso, the same folks who create a very popular Facebook ad creation and testing tool. They have experience with Facebook, so that’s always good.

Installing your pixel with this plugin is ridiculously easy. Within General Settings, click the Facebook Connect button.

Pixel Caffeine

After connecting to Facebook, Pixel Caffeine will pull up a list of your Facebook ad accounts and pixel IDs. Select what you want to use on this website.

Pixel Caffeine

Make sure the drop-down for pixel position is set to “Head” and you’re good to go. If all you want to do is install the pixel, that’s all you need to do — no copying and pasting at all.

Of course, there’s plenty more that you can do with this plugin if you wanted. I’m still getting a feel for it (I’m testing it out right now), but advanced features include the following:

  • Integration with WooCommerce
  • Filters by referrer, device type, categories and ecommerce behavior
  • Track custom fields
  • Advanced tracking by post type, login status and browser info
  • Pass advanced data like value, content ID and content type

PixelYourSite Pro

PixelYourSite Pro is a premium WordPress plugin that starts at $80. It’s what I’ve used on my old membership website.

Setup here is about as simple as Pixel Caffeine. You just need to know your pixel ID, and paste that in.

PixelYourSite

Once pasted and activated, the pixel will appear on every page of your website. That’s our core goal here. But other more advanced options include:

  • Track traffic source and type
  • Add standard or custom events
  • Add dynamic events (click on URL, click CSS selector, scroll, mouseover)
  • Integration with WooCommerce for dynamic ads
  • Add value and currency for purchase events
  • Add parameters for location, payment method, shipping method or coupons
  • Delay events
  • Easy Digital Downloads integration

Tracking Code Manager

Tracking Code Manager is another free WordPress plugin option (there is a PRO option as well). Setup isn’t quite as easy as Pixel Caffeine, but it’s not particularly complicated either.

Within the “Add New Script” screen, we’ll want to paste our entire Facebook pixel code that we found earlier…

Tracking Code Manager

Since this is the base code that we’ll want on every page of the website, we’ll need to select the following:

  • Position before the closing HEAD tag
  • Show on all devices
  • Standard code tracking in your WordPress
  • In the whole website (pages, posts and archives)

This plugin will allow you to inject different codes on different pages, which you may want to do with Standard Events. Overall, it’s not as robust as the two options above, but if you don’t need the bells and whistles, it does the trick.

The PRO version also allows you to manage other tracking codes within the same plugin (Google Adwords, WooCommerce, Easy Digital Downloads).

3. Google Tag Manager

Google Tag Manager is another method that many advertisers use for installing the Facebook pixel to their websites.

First, click the “Add a New Tag” button within Google Tag Manager…

Google Tag Manager

Select “Tag Configuration” and choose “Custom HTML.”

Google Tag Manager

Copy and paste the Facebook pixel code that we found earlier…

Google Tag Manager

Expand the Advanced Settings and make sure that the tag is firing “once per page.”

Google Tag Manager

Click into “Triggering” below…

Google Tag Manager

Make sure that “All Pages” is selected for your trigger.

Google Tag Manager

Then name, save your tag and publish, and you’re done!

4. Shopify

If you have a Shopify online store, the process of adding your pixel is very easy. Click “Settings” within your Shopify dashboard and then “Online Store.” Copy and paste your pixel ID (not your entire pixel) within the assigned box.

Shopify

5. Other Methods

There are countless other ways as well. Regardless of whether you self-host with WordPress or sell your products on a third party website, your primary goal is this: Find a way to inject your Facebook pixel code between the HEAD tags of every page.

Not every third party website will allow for this. But many will. Check out their FAQ or send them a support email if necessary.

Your Turn

As I said earlier, I’m not recommending any single method. You can get by on the basics, as long as you get your pixel installed (especially if you aren’t managing an ecommerce site). But these are the few ways that you can pull it off.

What method do you use for adding the Facebook pixel to your website?

Let me know in the comments below (without spamming the comments about your own product that isn’t on this list)!

The post 6 Ways to Add the Facebook Pixel to Your Website appeared first on Jon Loomer Digital.

No comments:

Post a Comment