Are you familiar with Facebook Conversion Pixels and Google Tag Manager? Do you know what is the best way to install these Conversion Pixels on your website?

Before I get into the details, let me share with you a proper backstory.

Facebook recently upgraded Conversion Pixels to the Custom Audience Pixels, promising load speeds up to 3x faster than the older version, solving one of the problems marketers faced.

One other big problem was supposedly the confusion between Conversion Pixels and Website Custom Audiences. Marketers had to install 2 snippets of code on their website and they were often unsure where each code should be installed.

The upgraded Custom Audience Pixels combined both codes into one. And the idea was simple:

1. Install a “base code” on every page of your website - this was relatively simple given that most websites are built using a base template nowadays.
2. Declare “standard events” on every page that you want to track specifically; among the standard events include:
   1. ViewContent
   2. Search
   3. AddToCart
   4. AddToWishlist
   5. InitiateCheckout
   6. AddPaymentInfo
   7. Purchase
   8. Lead
   9. CompleteRegistration

Personally, our team at J Social has seen improvements to the accuracy of conversions tracked on Facebook by upgrading to this pixel for several of our clients.

But I know that many of you out there are still struggling to understand the upgrade and how to install the pixels properly. So today, I’m going to bring you through how to do that exactly.

Wait, what is a Custom Audience Pixel?

For the benefit of those of you who aren’t sure, a Custom Audience Pixel is a small piece of javascript code that you copy and paste into your webpage to identify your website visitors so that you can retarget them on Facebook.

If you already have the Custom Audience pixel code placed on your website, you can upgrade to the latest version of the Custom Audience pixel to take advantage of its new features.

Quoting from Facebook’s Developers page:

The upgraded Custom Audience pixel makes things simple for advertisers by combining the two existing pixels and allows you to place a single pixel across your entire website to report conversions, build audiences and get rich insights about how people use your website.

This may look simple enough, but when you start implementing more than one pixel on your website, you’ll soon see how complicated and arduous it can be. Not only do you have to contact your webmaster or developer whenever you need to install a pixel, you also need to specify the instructions for him to do so. Worse, he may not understand how the Facebook Pixels work and may implement them wrongly!

With all these reasons, how can you make your life as a Facebook ads manager easy when it comes to implementing Facebook pixels?

The solution is to use Google Tag Manager.

What is Google Tag Manager?

Google Tag Manager gives you the power to create and update tags for your website and mobile apps, any time you want, at the speed of your business. Google Tag Manager is easy, free, and reliable. It gives marketers greater flexibility, and it lets webmasters relax and focus on other important tasks.

In short, Google Tag Manager is a powerful and flexible system for marketers to manage tracking codes on their sites.

And you can use it to implement Facebook pixels with GREAT EASE!

Creating a Google Tag Manager Account is simple.

It is the first step to take before you implement the Facebook pixel code.

Creating A Google Tag Manager Account

Setup Account

To start creating your account, sign in . You will be asked to type in the name of your business or whatever you want to use to indicate your website.

Then click Continue.

Setup Container

This time you need to decide where to put your tracking tag. A container holds all the tags for a specific website.

As you can see in the little gray box above, you will be asked to type in the container name. As mentioned above it should be named after the website it is being used for.

You can choose among the three options: Web, iOS, and Android. Then click Create.

The Google Tag Manager terms of service agreement will show up which you will need to click Yes to agree and proceed on getting the GTM code.

Install Google Tag Manager

After you agreed to the terms of service agreement, GTM will give you a piece of code. Place it immediately after the opening <body> tag.

Good news! You’ve just created your account in Google Tag Manager. The final step is to place the GTM code provided. It’s the ONLY tag you need to start managing all your tags.

The image above shows you the overview of the account you’ve created. You’ll see the following:

• New Tag
• Add a Note
• Recent Activity
• Published Versions
• Unpublished Versions


All the changes are recorded in the overview section.

Creating Tags and Triggers

Create Tag

Once you are done creating the container, you can start creating tags for your website. Google provides a few templates for its own tags, but since we are going to add Facebook pixel, we’re going to use Custom HTML tag.

Here are the steps on how to create tag:

1. To add a tag to a container, click Tag which is located on the left side of your screen and click on the “New” button on the top-right corner of your screen.
2. Rename the tag to what you want it to be called and choose Custom HTML Tag. Then click Continue.
3. In the Configure Tag, copy and paste the Facebook pixel code.

Fire Tag

This section lets you specify the page that triggers your tag.

Types of Triggers

• All Pages - This is the most common type where you can fire the tag. It means that the tag is triggered on every page of the website. Automatically, there will be a trigger created for this.
• Some Pages - The tag is triggered on a specific URL.

Types of Event Triggers

To setup these triggers, you may need the help of your developer.

• Page View
• Click
• Form
• History Change
• Custom Event
• JavaScript Error
• Timer

Creating a Trigger

In this section, I’ll be showing you how to trigger the tag on a specific page. You can specify the trigger in a landing page - thank you page, a product page, or any specific name of the web page.

Here’s a simple scenario:

You’ve created a campaign with Website Conversions as the objective. This means you need to track the number of conversions. To do that, within your custom audience pixel code, above the </script> tag, paste the Standard Event code that’s relevant to your page.

Here’s the new pixel code:

For more specific instructions on how to upgrade to the new custom audience pixel, check this reference.

Now you have the code, all  you need to do is to login to your Google Tag Manager account and install the pixel.

To guide you on how to do this, here are the step by step process:

1. Click Some Pages.
2. In Choose Pages, click the New button.
3. Type in the name of the Trigger, choose the variable, operation, and value.
4. Click Save.
5. Click Create Tag.

Do mind that if you manually added your tracking codes before, you’ll need to remove them to keep them from firing twice and skewing your data.

Verify Pixel

Your tag and trigger are already setup. Now you want to make sure if it is properly integrated or not. Let me tell you it’s definitely possible.

There are two ways you can perform to verify the installation of the pixel. Here they are:

1. Google Tag Manager’s Preview
2. Facebook Pixel Helper


I’ll be covering each of the options below. I am still using the Website Conversions objective.

Using Google Tag Manager’s Preview

To be able to use the GTM’s Preview, here’s what you need to do:

1. Copy and paste the URL of your site’s thank you page to your web’s browser. Go to GTM’s overview page and Click Preview.

2. Go to thank you page and refresh the page. There will be small notification window that will pop up at the bottom of your page. Based on the image, the Lead conversion pixel is fired up to the thank you page.

3. Go to GTM’s overview page and click Publish.

Note: You might notice that I instructed to click the Preview first than the Publish button. It is because you can click the latter if the trigger is fired correctly.

Using Facebook’s Pixel Helper

Kudos to Facebook because they made an effort to give us a way to find out if a pixel code is installed properly. To guide you on how to use the Facebook’s pixel helper, go to this reference.

The image above shows you the Pixel Helper.

I don’t mind using these two options to double check the placement of the pixel.

Conclusion

As a Facebook ads manager, I highly recommend using Google Tag Manager.  Sign up for an account at tagmanager.google.com. Once you’ve created your GTM account, try diving in, play around and experiment with it.

You can simply use the tool without using all the advanced features. Having a clean interface to store all of your tracking codes is what you need.

Have you implemented Google Tag Manager? How are you liking it? Let me know in the comment section below.