During the past couple of weeks, I’ve walked you through how to create custom Facebook pixelThe Facebook pixel helps advertisers track events that occur on their website and reach people who performed those events with ads. Morepixel eventsPixel events allow you to track specific actions on your website that can be used for reporting, targeting, and optimization. More that allow you to track, optimize for, and target visits based on time spent on a page and scroll depth. Today, we’ll take that a step further and combine the two.
The reason for this is simple. While both time on a page and scroll depth are good indicators by themselves of visit quality, they each have a weakness. You can spend three minutes staring at the title without scrolling (or simply load the page and walk away). You can scroll through a post in 10 seconds and not spend any time reading it.
Several people asked me whether the two can be combined, and I have good news: They can!
Today, we’re going to isolate that ultra-valuable audienceThis is the group of people who can potentially see your ads. You help influence this by adjusting age, gender, location, detailed targeting (interests and behaviors), custom audiences, and more. More of people who scroll at least 70% of a blog post AND spend at least two minutes reading it. If you read either of the past two weeks’ posts, portions of this post will be repetitive. But I want to be sure that, if you missed those posts, you know how to set up the base pixel in Google Tag Manager and test the events.
I’ll go through even more detail in my upcoming Facebook Pixel Masterclass (the first lesson is free). Go here to sign up!
Add the Base Facebook Pixel
I assume you have the base Facebook pixel code already installed on your website. Just in case, let’s walk through this anyway.
We’re doing this within Google Tag Manager. While there are likely ways to do it elsewhere, the variables and triggers provided by GTM make it easier to execute.
1. Create a tag and name it “Facebook – Base Pixel.”
2. Choose “Custom HTML” as the tag type under Tag Configuration.
3. Paste your base pixel code in its entirety within the HTML text box. Below is an example, but you should use your own code unique to your ad account.
4. Under Triggering, we want our base pixel code to execute on all pages of our website.
Create Variables
There are a couple of variables that we created during the past two weeks that we’ll use here. If you haven’t created them yet, let’s do that now. We need the pixel to record the percentage scroll depth and time on a page, so we add variables in Google Tag Manager.
1. Create a variable called “DLV – gtm.timerEventNumber” using the Data Layer Variable type. Use the data layer variable name “gtm.timerEventNumber.”
2. Create a variable called “DLV – gtm.timerInterval” using the Data Layer Variable type. Use the data layer variable name “gtm.timerInterval.”
3. Create a variable called “DLV – gtm.scrollThreshold” using the Data Layer Variable type. Use the data layer variable name “gtm.scrollThreshold.”
Create Scroll Depth Trigger
We want Facebook to fire an event as a visitor progresses on a page related to scroll depth.
1. Create a new trigger in Google Tag Manager and name it “Blog – Scroll to 50%.”
2. Select the “Scroll Depth” trigger type.
3. For vertical scroll depths, use percentages of 50, 60, 70, 80, 90, and 100.
4. Enable this trigger on “Window Load (gtm.load).”
5. Set to page path contains “/blog/”. I’ve decided to focus only on blog posts, but this is again optional. You could skip this step and it would execute on any page.
Create a Timer Trigger
We want Facebook to fire an event for every 30 seconds a visitor is on a page.
1. Create a new trigger in Google Tag Manager and name it “Blog – 30, 60, 90, 120, 180 seconds.”
2. Select the “Timer” trigger type.
3. For interval, use 30000 milliseconds (30 seconds). You can use a different interval if you please.
4. Set a limit of 6. Again, this is optional, but in my case I wanted to record events at 30, 60, 90, 120, 150, and 180 seconds.
5. Set to page path contains “/blog/”. I’ve decided to focus only on blog posts, but this is again optional. You could skip this step and it would execute on any page.
Create a Trigger to Combine Scroll Depth and Time Spent
We want Facebook to fire an event when a visitor spends at least 120 seconds and scrolls at least 70% of the way through a blog post.
1. Create a new trigger in Google Tag Manager and name it “Blog post – 120+ seconds AND 70% scroll.”
2. Select the “Custom Event” trigger type.
3. Enter “^gtm\.(timer|scrollDepth)$” for the event name and check the box for using Regex Matching.
4. Select to have the trigger fire on “Some Custom EventsConversion events tracked by the pixel, app SDK, or API that are outside of standard events. These tend to be created to fit the publisher's needs when a pre-defined standard event will not. For example, this website has custom events that fire based on scroll depth and time spent on a page. Read more about custom events here. More.”
5. Fire the trigger when DLV – gtm.timerEventNumber is greater than or equal to 4. Since we’re using intervals of 30 seconds, this equals 120 seconds.
6. Fire the trigger when DLV – gtm.scrollThreshold is greater than or equal to 70.
Create a Tag
Now, we are going to create a new tag in Google Tag Manager that will reference the trigger and variables we just made.
1. Create a new tag and name it “Facebook – Blog – 120+ Seconds AND 70% Scroll.” Names are up to you, of course.
2. Use the Custom HTML tag type.
3. Paste the following code within the HTML text box…
It should look like this…
4. Under Advanced Settings > Tag Sequencing, check the box next to “Facebook – Blog – 120+ Seconds AND 70% Scroll fires.”
5. Select the “Facebook – Base Pixel” tag under setup.
6. Under Triggering, select the trigger that we created previously.
Test Your Event
Let’s make sure this event is working. Within your Events Manager, select your pixel and click on Test Events on the left.
Open a separate window or tab and go to a page of your website where this event should trigger. Scroll through the entirety of that page, and it should appear within this window.
You can also use the Facebook Pixel Helper to test in this same way.
Create Custom Conversions
I’ve created a custom conversion for this event. We’ll need this for tracking and optimization.
1. Instead of “All URL Traffic,” select “Blog Tracking” under Custom Events.
2. Click to Add a Rule.
3. Instead of “URL,” select “Event Parameters.”
4. Select “Time and depth” as your custom parameter.
5. Enter “120” next to “Contains.” I’ve only created one custom parameter under this event, so this rule should pick it up.
6. Name it, select a category (probably “Other”), and set a value (probably leave it blank).
You can test these custom conversionsCustom conversions let you create rules for events or URLs so that you can better track and optimize for specific actions with Facebook ads. More just as you tested your event. You should also start to see activity within your list of custom conversionsA conversion is counted whenever a website visitor performs an action that fires a standard event, custom event, or custom conversion. Examples of conversions include purchases, leads, content views, add to cart, and registrations. More. Note that the activity will be lower than what you were seeing with time on page and scroll depth alone. These are now the best of the best visits!
Add Columns in Ad Reports
This is information you should monitor within your ad reports, particularly when you drive traffic to blog posts. To do that, click to Customize Columns…
And then find your new Custom Conversion and check the boxes to add it to your report.
Optimize for High-Quality Traffic
If you would normally run campaignsThe campaign is the foundation of your Facebook ad. This is where you'll set an advertising objective, which defines what you want your ad to achieve. More to promote blog posts, let’s do it a little differently.
First, use the Conversions objectiveThe objective reflects the goal you want to achieve with your advertising and is established at the campaign level. More rather than Traffic.
When you set Optimization for Ad DeliveryHow you optimize impacts who sees your Facebook ad. Facebook will show your ad to people most likely to perform your desired action. More at the ad setAn ad set is a Facebook ads grouping where settings like targeting, scheduling, optimization, and placement are determined. More level, select the custom conversion you’ve created.
By setting up campaigns this way, Facebook will attempt to show your ads to people most likely to spend at least two minutes and scroll at least 70% on a blog post.
Create Website Custom Audiences
We can now create audiences based on the new event we’ve created…
This lets you focus on targeting those who actually READ your blog post — beyond those pesky Blog Post Title scanners and quick scrollers.
Facebook Pixel Masterclass
I’ll go into more detail on this topic (and many others) in my upcoming Facebook Pixel Masterclass. We’ll talk about everything from the basics to the most advanced. I hope you’ll join me!
Your Turn
This approach has changed my Facebook advertising. It gives me a much clearer view of the quality of visitor I’m driving and allows me to optimize for that type of visitor. This isolated audience also gives me an option for targeting of a small, value-packed group.
Are you doing something similar? What do you think?
Let me know in the comments below!
