PREVIOUS

Rule based Segmentation

NEXT

Chapter 2 - Scroll Depth

Chapter 1 – Time on Page

Intro

Time on page is one of the most basic and commonly used metrics to help understand the engagement level of a visitor, following the basic logic of longer time on page equals higher interest on part of the visitor.

While Google Analytics Facebook provide a similar metric, their measurement in inherently flawed. Their measurement relies on the time difference between two consecutive pageviews to derive the time a user spent on a page. In the case that the user didn’t continue to a next page, the time they would assume that user spent on the page is 0!

Use Case – Measuring engagement on a blog post

Blogs face a peculiar challenge. On the one hand, they feature valuable content, on the other hand, they often lack a clear ‘conversion event’ which makes it difficult to understand if a visitor of the page is worth remarketing to or not.

To understand if a visitor is worth remarketing to, what we really want to know is how much of a given article, or page, they read. This is where a metric like time on page, comes in handy.

If we take the time a visitor spent on the page and couple it with the average article reading time we can estimate how much of the article that visitor read.

For example, let’s say we have a 500-word article on our blog. The average reader would read it in about two and a half minutes. This means, that if a visitor stayed for two and a half minutes or three minutes on the page, there’s a chance that the visitor read the article.

How To Setup

This short guide will help you set up the trigger. If you’d like a shortcut, we’ve created a simple tool that will prepare a downloadable Google Tag Manager container -> Click here

1

Find out How long your article would take to read

The average reading speed for an adult is about 200 words per minute. So a 1000 word blog would take about 5 minutes to read. 

Here’s a great tool to help you translate your specific word count to the time needed. 

Input the length of your post to get an estimated read time

2

Setup a Time on Page trigger in Google Tag Manager

Open GTM and go to the Triggers screen

Click on NEW

Give your trigger a name – “Time on Page” for example

Click on the pen to choose trigger

Choose timer

Select an interval at which the event will be fired in milliseconds. 

e.g. A value of 30000 would mean that the event would be fired every 30 seconds. If a visitor stays a minute and 20 seconds, the event will be fired twice once at 30 seconds and once at one minute. 

We’ve found 30 seconds (or 30000ms) to be a reasonable interval to work with, but you can choose to use more granular values.

Set a limit.
This means an upper limit after which the timer will stop firing events. This is meant to cap off events.

e.g. A value of 4 would mean that the event would be fired 4 times at the interval set above.
So 30 seconds interval with a limit of 4 will fire at 0:30, 1:00, 1:30 & 2:00

We recommend using an upper limit of double or triple the time it takes to read the article.

Choose where the trigger will fire.  If you’d like the event to fire on a specific page or category enter:
Page Path – Contains – /category/post

If you’d like the event to fire on all pages enter:
Page Path – Matches RegEx – .*

3

Create a Timer Data Layer Variable

Go to the Variables screen

Under ‘User-Defined Variables’ Click on NEW

In variable type, select: “Data Layer Variable

Name the Variable ‘DLV Timer’

In ‘Data Layer Variable Name ‘ enter:
gtm.timer

Click ‘Save’. 

4

Create an Elapsed Time Data Layer Variable​

Go to back to the Variables screen

Click on NEW

In variable type, select: “Data Layer Variable

Name the Variable ‘Elapsed time’

In ‘Data layer variable name enter:
gtm.timerElapsedTime

Click ‘Save’. 

5

Convert Elapsed Time from milliseconds to seconds

Go to GTM Click on Variables

Click on NEW

In variable type, select: “Custom JavaScript

Name the Variable ‘Elapsed time in Seconds’

Enter the following code in the Custom Java Script line.
function () { return Math.round({{Elapsed time}} / 1000)}

Click ‘Save’. 

6

Create a Tag to fire the event to Facebook

Go to GTM Click on Tags

Click on NEW

Give your Tag a name, for example “Facebook Time on Page”

In Tag configuration select Custom HTML 

Paste this code into the tag:
<script>  fbq(‘trackCustom’, ‘time on page {{Elapsed time in Seconds}} seconds’) </script>

Time on Page Facebook

Click on Triggering

Select your previously created trigger, “Time on Page”

Click on Save

7

Create a Tag to fire the event to Google Analytics

Go to GTM Click on Tags

Click on NEW

Give your Tag a name, “Google Analytics Time on Page”

In Tag configuration select Google Analytics

In Track Type select, “Event”.

In Label enter “time on page”

In Label value enter {{Elapsed time in Seconds}}

In Google Analytics Settings, Use your Google Analytics Settings Variable. If you don’t have one, simply click on Create Variable and enter your Google Analytics ID.

Set the Non-Interaction Hit field to TRUE to avoid a negative impact on Bounce Rate

Click on Triggering

Select your previously created trigger, “Time on Page”

Click on Save

Downloadable GTM container

Here’s your shortcut to glory!

Ready made GTM container fully set up with tags for Google Analytics and Facebook. You can easily customize the settings such as the timer’s interval and limit.

Just download this GTM import file below, unzip it, and follow the instructions.

Log into your GTM account

Choose to the Account and Container in which you want to install Fixel

Navigate to the Admin section

Choose ‘Import Container’

Click ‘Choose container file’ and select the JSON file downloaded

Select the ‘Existing’ workspace option

Change the radio button to ‘Merge’

This is very important so that all your existing configuration carries over to the merged container.

Keep the ‘Overwrite conflicting tags, triggers and variables’ selection

Click ‘Confirm’

Publish the container by clicking ‘Submit’ on the workspace’s main screen