What Is A Tracking Pixel?!? Why You Need One And How To Set It Up!

Continuing from the last post, I have decided that I will cover pixels today! This post will be fairly long and written in the style of a tutorial for how to create, how to install, and how to set up events. This will be the first in a series of posts related to analytics and metrics. So what exactly is a pixel? In the marketing and advertising world, a pixel is a small piece of code that runs on the web page. This code is used to collect information about visitors. Along with things such as the type of browser that the person was using, these send other types of data back to sites such as Facebook and Google for analytical purposes. Google Ads uses a different name for this piece of code, they call it a tag. In this post, I will cover the Facebook pixel but the process to install the code is exactly the same process for other platforms.

So How Can I Benefit From This?

The data that is sent back to places such as Facebook help them track the user on the site. From our perspective, we want to know how many users viewed our website. This type of tool can also be used to help us during our split testing by placing this code on each page. Doing this can allow us to see where users are going or not going. If a user is not going to a page that we want them to go to, this can indicate a problem with the page.

How Do I Get A Pixel?

There are a couple of ways to obtain this piece of code. The first one is from your ad account on Facebook. When you go into the ad manager, you will see an option for “pixel” in the drop-down. I will go through a quick example now.

The Black Box is Where You Create Your Pixel
The Black Box is Where You Create Your Pixel

When you click “Pixels” it will take you to another screen that says data sources. Inside of here, you will see any pixels you have created.

Picture of a Created Pixel
Picture of a Created Pixel

If you click on the name of the pixel it will take you to the “Overview” screen where you can get to your pixel code. In the screenshot below, I have removed any analytical data that is there. Instead, I have included the important parts for what we want to do.

This is the Overview Page
This is the Overview Page

In the top right-hand corner, you will see a drop-down menu titled “Set Up”. This is where the pixel code is. If you click the drop-down, you will see “Install Pixel”. This is the option that you want to use.

Install Pixel Option
Install Pixel Option

After you click “Install Pixel” it will present you with a popup. There are two options here and you will want to use “Manually add pixel code to website”. While there are good integrations that can be used I will generally use this method to control where the pixel is installed. This gives better flexibility for analytical purposes.

Popup Menu from “Install Pixel”
Popup Menu from “Install Pixel”

Yet again you will be presented with another popup. This time, we can see our code. We click the “Copy Code” button and then continue. This is where things can get a little tricky.

The Code Screen for the Pixel
The Code Screen for the Pixel

Once you copy the code, click continue and this is where the fun begins.

Retargeting Option
Retargeting Option

In the screen above, you can see an option for automatic targeting. We will turn this on to reach more potential clients. If you

Screen After Turning On Advanced Matching
Screen After Turning On Advanced Matching

Finally, we are at the “Event Setup”. This is where we can tell Facebook what events on our website that we want to track. For instance, if a potential customer visits certain pages but does not go to a different one.

Event Setup Launch Screen
Event Setup Launch Screen

We will click the “Launch Event Setup Tool” button to start setting everything up. At this screen, we will need to enter our website URL. Before we do this though we will need to add the pixel to our website or sales funnel. So I am going to break this post now and go to the event setup after installing the pixel.

How Do I Install The Pixel?

This is a part that can be tricky for some folks. Depending on the platform that you are using, there are different ways. In this post, I will show how to install the pixel into Clickfunnels and manually into the head section of a website. The manual install is definitely not for beginners so I would recommend using the Clickfunnels option. You do not need to do both of these options, only one or the other depending on your platform. I am showing the easy way and the harder way based on what I have access to.

Clickfunnels Install

I will run through both of the options for pixel install quickly. If you log into your Clickfunnels dashboard, go to your funnels, select the one you want to work with, and you will see something similar to this in your dashboard.

Image of a Site in the Dashboard
Image of a Site in the Dashboard

Once you go in, click “Edit Page”. Once you are in the editing window, click on “Settings”. You will see an option that says “Tracking Code”, this is where you paste the pixel code.

Tracking Code Option Highlighted in Red
Tracking Code Option Highlighted in Red

Once you click the button, it will open an editor. Just paste the code inside of the window and close it.

Editor Before Pixel Install
Editor Before Pixel Install
Editor After Install
Editor After Install

Now, close the save button, wait for the green thing to quit spinning, and you are done. No mess, no worries about accidentally deleting something, quick and easy.

Manual Install (Advanced)

To install the pixel manually into the head section of your website, first, you need to open the source code in whatever editor you use. For instance, Godaddy has a web-based editor that will allow you to modify source code. You can also use notepad if you have the files locally on your computer. I will briefly show how to perform this activity using Atom. I should note that once the modification is made, you will need to upload the source code to wherever your site is hosted. That is outside of the scope of this post but I may cover this in a later article. The head section of the source code is where you want to paste the copied code. As you can see in the picture below, the head section is at the very top of the page.

Image of a Head Section
Image of a Head Section
Pixel Code Pasted Into the Head Section
Pixel Code Pasted Into the Head Section

Once the code is pasted in, go ahead and save the file. It is ready to upload.

Event Setup

Alright, back to where we were. Setting up events is fairly straight forward. Once the pixel is installed, you enter your website or sales funnel address and it will give you the option to open the URL. Hopefully, you left the “Event Setup Tool” open, if not no worries, I will show you how.

In the “OOverview” window from the ad manager I showed you earlier, click on the “Open Event Setup Tool” button. This will open the window for you to enter your website or sales funnel address.

The Overview Page in Events Manager
The Overview Page in Events Manager

Once the tool is open, enter in your address and click “Open Website”. You will then be guided through setting up events on different pages.

Event Setup Tool
The Set Up Events Window

Once the page opens you will be presented with something similar to this window. I already have events set up for this site so just imagine that it is empty. I will show you how to set up the events.

Event Setup Tool
Event Setup Tool

You have the option to track button clicks or track the URL. In this post, I will show you how to track the URL for the sake of simplicity. Play around with the other option though as it will come in handy.

So if we click the “Track a URL” button we will see a new screen.

Screen to Set Up the Event
Screen to Set Up the Event

If you click the “Select an event” drop-down you will see a bunch of options. For the sake of speed and generality, I will show the option I use to see what page people are getting stuck on during the split-testing phase. I will use the other options throughout my analysis but again, for the sake of simplicity, I will use the “View Content” option.

Events Drop-Down
Events Drop-Down

Select the “View Content” option and click confirm. After you have set up all of the events you want to track, click “Finish Setup” in the top right of the window.

The Finish Setup Button
The Finish Setup Button

After you click this button you will be taken back to ads manager where you can watch all of the events for your site.

That is the end of the post. As I expected, it is fairly long. Hopefully this helped you understand how to setup, install, and setup events for your site. Thank you for checking out the post. Remember, Just Keep GOING!!!

Leave a Reply

%d bloggers like this: