Are you looking for a Facebook Ads report to identify website pages that trigger the most attention from your audience? Looking for a visual presentation of the current interest flow rates for landing pages linked to your Facebook Ads?

In this tutorial you’ll learn how to set up a custom report using conditional formatting to quickly identify pages that succeed in keeping attention from viewers and pages that need to be tweaked to increase interest rates.

This post will show you how to configure these custom events step-by-step using Google Tag Manager and how to create a visual report in Meta Business Manager that will provide insights you may be missing when using default Ads Manager reports or default Google Analytics setups.

The report will show how users are going from being attracted to your website page to spending more than 30 seconds on the page reading and scrolling through your content.

Note that this report may function as a framework for your business and needs to be adapted to your business’ KPI’s and goals. The example report in this tutorial focuses on simplicity and showing the true added value of working with custom reports.

The report in this tutorial is useful for businesses that focus on generating quality website content and want their readers to keep reading, show interest and engage with their content.

If you are an ecommerce business, you should adapt the configuration of the different triggers and variables to values that are relevant for your business. Think about adding product engagement-based triggers instead of time on page triggers in that case.

After you’ve completed this tutorial, you’ll have access to a brand new custom report that will look similar to the screenshot below. It will allow you to quickly identify best and worst performing pages linked to your Facebook ads.

Attracted > Interested > Engaged Visit Flow
Attracted > Interested > Engaged Visit Flow

Before getting into details, be sure you have the following tools installed on your website and have full access to the following interfaces:

The value of Custom Reporting in Ads Manager

I have to admit that nowadays, it’s much more challenging to find data that is clear and usable to act on. Privacy-first tracking, opt-outs and different attribution settings across different ad/reporting platforms make it difficult to monitor true performance of your ads.

Tools like Google Analytics don’t show specific engagement metrics by default. You would need to set up custom events to report on different pages. Then you would also need to filter by source, medium and campaign to report on Facebook Ads performance. And last but not least, Google Analytics uses a different attribution setting (last non-direct click) for its reports, resulting in numbers coming from Facebook Ads getting lost in reporting.

In this report, let’s eliminate the need for Google Analytics. This tutorial will create a custom report in Meta Ads Reporting and will only show results that are collected by the Meta Pixel. The results in this report will follow the attribution settings specific to your Facebook campaigns. This way you will details on each campaign and it will allow you to quickly identify winners and losers.

You will create a visual report showing the flow of time being spent on your website pages.

Let’s dive in!

Step 1: Set up Triggers in Google Tag Manager

The custom report that you will be creating is based on the following three custom metrics:

  1. Attracted
  2. Interested
  3. Engaged

All of these 3 custom metrics need to be send through the Meta Pixel as a Custom Event that gets triggered by a specific trigger. The following triggers will fire the following tags:

  • 5 seconds on page trigger will fire the ‘Attracted’ tag
  • 20 seconds on page trigger will fire the ‘Interested’ tag
  • 30 seconds + 50% scroll depth trigger will fire the ‘Engaged’ tag

When people land on your website page, they may fire all three tags or drop-off at one of these moments. The triggers will log the time on the page to send accurate timer-based custom events to Meta Ads Reporting.

Create Timer event triggers

Let’s start by creating a new Timer trigger. Navigate to Google Tag Manager and open your website container workspace. Select ‘Triggers’ and and click New to create a new trigger.

Select the ‘Timer’ trigger from the list of trigger type options.

Add a New Trigger in Google Tag Manager
Add a New Trigger in Google Tag Manager
Add a '5 seconds on page' trigger
Add a ‘5 seconds on page’ trigger

In the Trigger configuration screen, set the ‘Interval’ field to 5000 milliseconds. This equals 5 seconds.

Next, set the ‘Limit’ to 1. This will make sure that this Timer trigger will only fire on the first 5 seconds, instead of getting fired every 5 seconds. This will make sure that the ‘Attracted’ Tag will also only fire once per page.

To cover all pages of your website, set the ‘Page Path contains’ field to ‘/’. This will cover all of your website URLs having a /, meaning all pages.

Your first trigger is now configured. Hit Save.

The next trigger to create is the ’20 seconds on page’ trigger. This trigger will be used to fire the ‘Interested’ tag.

When people keep reading your page for at least 20 seconds, it will mark that page view as an ‘Interested’ page view.

Set the same fields as in your first trigger, but change the ‘Interval’ field to 20000 milliseconds (this equals 20 seconds).

Save the trigger.

Add a '20 seconds on page' trigger
Add a ’20 seconds on page’ trigger

The final ‘Engage’ trigger is based on a group of triggers. Therefore, you need to first create two seperate triggers:

  1. A timer trigger based on 30 seconds
  2. A scroll depth trigger based on 50% scroll depth

Create the timer trigger the same way you created the 5 and 20 seconds triggers.

Set the Interval to 30000 and set the other fields the exact same way again.

Hit Save.

Add a '30 seconds on page' trigger
Add a ’30 seconds on page’ trigger

Now add the second trigger using the ‘Scroll Depth’ trigger type. Navigate to the Trigger overview and click New Trigger. Search for ‘scroll’ and select the Scroll Depth trigger.

Add a 'Scroll Depth' trigger
Add a ‘Scroll Depth’ trigger

In this configuration, the trigger needs to fire on a 50% scroll depth. This means that the user will need to scroll at least 50% of your page. It is used to measure an interaction on top of the 30 seconds trigger. This will prevent the ‘Engaged’ tag to fire when people just leave the website page open without interacting.

Select the ‘Vertical Scroll Depths’ option and set the percentages to log ‘10,25,50,75,100’ percent. This configuration allows you to choose a custom scroll depth if you wish to do so.

For this trigger to work on a 50% scroll depth, set the ‘Scroll Depth Threshold’ to ‘greater than or equal to ’50’.

Add a '50% Scroll Depth' trigger
Add a ‘50% Scroll Depth’ trigger

Now you will need to combine both triggers into one ultimate ‘Trigger Group’.

Create a new Trigger, search for ‘Trigger Group’ and select the ‘Trigger Group’ trigger.

Create a 'Trigger Group'
Create a ‘Trigger Group’

This ‘Trigger Group’ trigger type configuration will allow you to select the triggers you want to group together. Select both the ’30 seconds on page’ and ‘50% Scroll Depth’ triggers you’ve created in the previous steps.

Set to fire this trigger to ‘All Conditions’ and hit Save.

Create a '30% seconds / 50% scroll' trigger
Create a ‘30% seconds / 50% scroll’ trigger

Step 2: Create Pixel Custom Event Tags

Tags will hold the custom Pixel events and will send the three states of the page view to Meta. These tags will fire upon the triggers that you’ve created in the previous steps.

You’ll need to create different tags to fire these three Custom Events:

  1. Attracted
  2. Interested
  3. Engaged

Start by navigating to ‘Tags’ and click New to add a new Tag.

Add a new 'Tag'
Add a new ‘Tag’

Search for ‘html’ and choose the ‘Custom HTML’ tag type to get started.

Create a new 'Custom HTML' tag
Create a new ‘Custom HTML’ tag

Add the following code in the Cutom HTML field:

<script>
  fbq('trackCustom','At', {
    page: '{{Page Path}}'
  });
</script>

This little script creates a Custom Event that will use the Meta Pixel to send data back to Meta.

Create a custom 'Attracted' Pixel event
Create a custom ‘Attracted’ Pixel event

The ‘Page Path’ variable will allow you to filter by page once you create a Custom Conversion in Meta Ads Reporting. This is useful when you want to create reports showing the engagement flow for specific pages only (optional). If the Page Path variable is not available to select, be sure to first add this built-in variable to the list of variables by navigating to the ‘Variables’ section.

After pasting the code above, add the ‘5 seconds on page’ trigger. This will make sure that the ‘Attracted’ tag will only fire after a 5 seconds page view.

Hit Save to save your tag.

Now follow the same configuration to create the ‘Interested’ tag. Copy and paste the following code into the HTML field:

<script>
  fbq('trackCustom','In', {
    page: '{{Page Path}}'
  });
</script>

Select the ’20 seconds on page’ trigger to fire the ‘Interested’ tag when people have been reading your page content for at least 20 seconds.

Create a custom 'Interested' Pixel event
Create a custom ‘Interested’ Pixel event

Almost done setting up the configuration in Google Tag Manager.

Create the final ‘Engaged’ tag. Copy and paste the following code into the HTML field for this new tag:

<script>
  fbq('trackCustom','En', {
    page: '{{Page Path}}'
  });
</script>

Make sure you set this tag to only fire once per page.

Set Tag Firing to fire Once per page
Set Tag Firing to fire Once per page

Now select the Trigger Group ’30+ seconds / 50% scroll’ and hit Save.

Create a custom 'Engaged' Pixel event
Create a custom ‘Engaged’ Pixel event

Done! Now publish the changes and continue to the testing part of this tutorial.

Click Submit to publish your new tags and triggers.

Submit changes in Google Tag Manager
Submit your changes

Step 3: Testing Tags And Triggers

Here comes the fun part! Let’s test if your tags are fired at the right timings.

There are two ways to be testing the setup.

  1. Using the Pixel Helper browser add-on
  2. Using Events Manager ‘Test Events’ in Meta Business Manager

Test configuration using the Facebook Pixel Helper add-on

Install the Pixel Helper as an add-on to your browser to help you debug your new Google Tag Manager setup.

Navigate to your website and open a page.

Open the Facebook Pixel Helper add-on and watch how the the custom events are being executed.

The first tag that should fire is the ‘At’ (Attracted) event. This event identifies a user that is attracted to your page and keeps reading for at least 5 seconds. The tag should fire after 5 seconds. Make sure it does.

All good? then keep the same page open and wait for another 15 seconds.

Debug 'Attracted' events using the Facebook Pixel Helper
Debug ‘Attracted’ events using the Facebook Pixel Helper

After 20 seconds, the ‘In’ (Interested) custom event should fire.

When people keep reading your page for 20 seconds, it means they are interested in the content. If your page needs a longer threshold, you can change the timer interval for that trigger in Google Tag Manager. The same goes for all other trigger settings btw.

Debug 'Interested' events using the Facebook Pixel Helper
Debug ‘Interested’ events using the Facebook Pixel Helper

Now allow another 10 seconds to verify that the ‘En’ (Engaged) tag fires. Remember that this tag only fires after 30 seconds AND when a user also scrolled at least 50% of the entire page length.

Continue to the next step when all three tags have been successfully tested using the Pixel Helper.

Debug 'Engaged' events using the Facebook Pixel Helper
Debug ‘Engaged’ events using the Facebook Pixel Helper

All custom events are being tracked? Cool!

Let’s confirm the same using Events Manager within Meta Business Manager.

Test configuration in Event Manager

Navigate to Meta Business Manager and open the ‘Events Manager’ interface.

Events Manager overview
Events Manager overview

Now click the ‘Test events’ tab and make sure you’ve selected the right Pixel for testing.

In the ‘Set Browser Events’ field, enter your website page url and click Open website. This will open your website in a new tab. Leave the tab open and navigate back to the ‘Test events’ overview.

You should already see 1 PageView event and after 5 seconds, the first ‘At’ (Attracted) custom event should also appear.

Test events in Meta Events Manager
Test events in Meta Events Manager

Wait another 15 seconds for the ‘In’ (Interested) to appear. Now navigate back to your website and scroll at least 50% of the current page and wait another 10 seconds. This behavior should trigger the last ‘En’ (Engaged) tag.

All good? Great work! You can now start building the custom report.

Debug events in Meta Events Manager
Debug events in Meta Events Manager

Bonus: If you want to report these metrics for specific pages only, you can make use of the ‘Page’ variable. Each custom event also sends the Page Path as a variable for you to use in your adapted setup (optional).

Note that this tutorial will continue configuration without specifying a specific page path.

Debug events in Meta Events Manager
Debug events in Meta Events Manager

Step 4: Create Custom Conversions

Now let’s continue building the custom report. To create this custom report, you first need to create 3 custom conversions based on the 3 custom events you’ve configured in the previous steps.

Setting up Custom Conversions is quite easy.

Click the Custom Conversions icon in the left menu and hit the Create Custom Conversion button at the top of the page.

Create Custom Conversion in Events Manager
Create Custom Conversion in Events Manager

The first Custom Conversion will be the ‘Attracted’ conversion.

Name your custom conversion ‘Attracted’ and be sure that you’ve selected the right Pixel. Usethe dropdown below ‘Event’ to select the ‘At’ custom event.

Leave the standard event for optimization set to ‘Facebook selected category’.

Under Rules, choose URL contains ‘/’ to fire this custom conversion on all pages of your website.

Create Custom Convesion 'Attracted'
Create Custom Convesion ‘Attracted’

Now do the same for the custom conversion ‘Interested’. Be sure to select the ‘In’ event.

Create Custom Convesion 'Interested'
Create Custom Convesion ‘Interested’

One more time! Create the Engaged custom conversion and select the ‘En’ event for this one.

Create Custom Convesion 'Engaged'
Create Custom Convesion ‘Engaged’

When you navigate back to the Custom Conversions overview after some time, you need to see thatall three custom conversions being active and receiving hits. If you don’t see the ‘Active’ status yet, don’t panic. If you followed all steps above correctly, they will start appearing any time soon.

Wait until all custom conversions are active before proceeding with the next steps.

Custom Conversions Overview
Custom Conversions Overview

Step 5: Create a custom report in Ads Reporting

Time has come to create the custom report. Open the menu in Business Manager and select ‘Ads Reporting’ below ‘Analyze and report’.

Ads Reporting within Meta Business Manager
Ads Reporting within Meta Business Manager

Click the green ‘+ Create report’ button and name your custom report. You can use whatever name that makes sense for you. I’m naming this report ‘AIE flow’ as it will show the flow from Attracted to Engaged.

Below the Ad accounts selection, be sure to select the Ad Account that is linked to your Pixel and website.

Hit Create to continue.

Create a Custom Report in Ads Reporting
Create a Custom Report in Ads Reporting

This report will use a pivot table layout. Select ‘Pivot table’ and click Continue.

Select the 'Pivot Table' layout
Select the ‘Pivot Table’ layout

The first column of the report will be the breakdown you want to see results for. Select ‘Campaign name’ to get started.

Note that you can add or change breakdown at all times. Adding new breakdowns may help you to find interesting results to act on. Set breakdowns that make sense for your business and current ad account setup.

Breakdown by Campaign Name
Breakdown by Campaign Name

Now let’s continue creating columns to show custom event numbers.

Select ‘Metrics’ and search for custom conversion ‘Attracted’. Select this conversion and notice that it will automatically add this conversion as a new column in your report.

Add metric 'Attracted'
Add metric ‘Attracted’

Repeat the previous step and select the ‘Interested’ custom conversion.

Add metric 'Interested'
Add metric ‘Interested’

And do the same for the ‘Engaged’ custom conversion.

Add metric 'Engaged'
Add metric ‘Engaged’

You now have a report showing a breakdown by campaign and 3 reporting columns for each of your custom conversions.

The goal of this custom report is to quickly identify drop-offs between different engagement events. Therefore, you will need to create 2 more custom metrics to show the rates between two custom conversions.

Create a Custom Metric
Create a Custom Metric

Select Metrics and click the Create button in the ‘Custom metrics’ section. A configuration screen will appear. Name this custom metrics ‘Attracted to Intersted Rate’ and select the ‘Percentage (%)’ format. This will show the success rate going from attracted to interested.

The formula is easy: ‘Interested divided by Attracted’. This formula will generate the percentage of times when interested followed the attracted event.

After adding the formula, click Create metric to save your custom metric.

Attracted to Interested Rate
Attracted to Interested Rate

The next custom metric to create is the ‘Interested to Engaged Rate’. It follows the same principles as the previous metric. Use the formula ‘Engaged divided by Interested’ and Click Create metric to save this new custom metric.

Interested to Engaged Rate
Interested to Engaged Rate

After adding these 2 custom metrics, you will now see two extra columns in the custom report. You’re almost done now. The only thing to add is the conditional formatting to help you ‘read’ the report more easily.

Select Format at the top right of the reporting table and click Create rule to add a new conditional formatting rule.

Create a Conditional Formatting Rule
Create a Conditional Formatting Rule

First you’ll need to choose the column to which you want to apply conditional formatting. Select the ‘Attracted to Interested Rate’ column and select the condition ‘Greater than or equal to’. Now set the desired threshold that makes sense for you. I’m using 70% to report on ‘positive’ results. 70% equals ‘0.7’ in this field.

Select the color ‘Green’ and save the rule.

Attracted to Intereste Rate conditional formatting
Attracted to Interested Rate conditional formatting

Now create another conditional formatting rule to identify middle range results. Select the ‘In range’ condition and set your desired numbers. Select the color Yellow and save the rule.

Mark middle rates yellow
Mark middle rates yellow

For the negative numbers, you need to create one last rule. Select the ‘Less than’ condition and set the number to 0.5 (equals 50%) or use another number that makes sense for your business.

Select the Red color and hit save.

Mark negative rates red
Mark negative rates red

All done for the first custom metric.

Now repeat the exact same configuration for the ‘Interested to Engaged Rate’.

Repeat Conditional Formatting
Repeat Conditional Formatting

Continue creating the conditional formatting rules. You know the drill now.

Conditional Formatting Overview
Conditional Formatting Overview

Aaand you’re done!

You’ve successfully created a brand new custom report using conditional formatting that will help you identify winning landing pages and issues where drop-off rates are higher than expected.

Don’t forget to save your custom report 😉

How to act on results?

Let’s look at some examples.

The report below is showing that the ‘attracted to interested rate’ is mostly positive (green) for most campaigns.

Right now I can identify 4 campaigns that don’t deliver the time on page threshold that I’m aiming to achieve. I will need to check the campaign setup, ads and landing pages that are attached to my Facebook ads in these campaigns to identify possible issues.

Attracted > Interested > Engaged Visit Flow
Custom Report example

It might just be that the pages showing yellow numbers take too long to load or don’t trigger users to keep browsing/reading the content. People are leaving the page before they hit the 20 seconds on page mark.

When you’re seeing red numbers in the ‘Attracted to Interested Rate’ column, it may have different reasons. When people drop off before the 20-seconds mark, it may mean that the content isn’t relevant or people just didn’t intent to visit your landing page. Check the placements where your ad appeared and consider the ad format when evaluating these numbers. Some placements optimize for keeping enagement on the Facebook or Instagram app itself.

When all looks good on the page itself, re-verify if the relevance of your Facebook Ad to the landing page is high. When the message of your ad doesn’t reasonate with the content of the landing page, people will leave your website early. Change the landing page attached to your ad or adapt your content to the message of your ad.

Now let’s take a look at the numbers going from ‘Interested to Engaged’. These are people who are really interested in your content. They are scrolling thriugh the page and keep reading the content for at least 30 seconds.

When you’re seeing green numbers, it usually means that your Facebook campaign targets the right audiences and your message makes sense. People are triggered to click your ad and the content is relevant. Check the setup of your campaigns showing green results and compare this to campaigns that are generating yellow or red results.

Final notes

Making smart choices when optimizing your Facebook campaigns can be difficult. We tend to lose ourselves in big data and complex user flows. Then there are also many reports and tools showing different attribution settings that it may cause false interpretations of data.

By creating ‘simple’ reports like this one, you can focus on the most important metrics for your business. This example simply focuses on time on page and scrolls, making it super easy to interpret. But you can change these metrics to whatever metrics are relevant for your business.

If you need other types of engagement actions, you can easily use this framework to report on actions that are aligned to your most important KPI’s and goals.

Keep testing!

TLDR? Here’s the video tutorial:

About the Author

Bram

Bram Van der Hallen is an all-round Belgian Digital Marketer and Meta Certified Professional with 16+ years experience in media planning and buying.Bram talks about Facebook Ads and all things Digital Marketing on LinkedIn where more than 80.000 marketers follow his weekly updates. Click here to Follow Bram on LinkedIn.

View All Articles