Hey there!
I'm Benjamin from Loves Data.
In this video you'll learn how to track scroll depth using Google Tag Manager.
The amazing team behind Google Tag Manager have been releasing lots of great new features.
We've seen the release of new triggers to track embedded YouTube videos, element visibility
and scroll depth.
So we're going to look at how we can use the new scroll depth trigger to send data into
Google Analytics.
So why would you want to take the time to track people scrolling on your website?
Well, tracking scroll depth allows you to understand how people are engaging with your
content beyond a simple page view.
You can configure Google Tag Manager to send data to Google Analytics to see the number
of people who are viewing your pages.
This allows you to track people viewing 25 percent, 50 percent, 75 percent and 100 percent
of a page.
We're going to use the new built-in scroll depth trigger and variables to get this data
into Google Analytics.
Let's head to Google Tag Manager and get started!
To begin, let's select 'Variables'...
And click the 'Configure' button at the top of the window...
Now let's scroll down and enable the new scroll depth variables...
These are 'scroll depth threshold', 'scroll depth units' and 'scroll depth direction'.
Enabling these variables means that Google Tag Manager will automatically populate the
data layer with details as people scroll.
We're going to track people viewing 25, 50, 75 and 100 percent of the page, so the 'scroll
depth threshold' will be the values, so 25, 50, 75 and 100.
Then 'scroll depth units' will be 'percent' - you also have the option of tracking pixels
if you prefer, but the problem is that your pages are all likely to be slightly different
lengths, so I'd recommend using 'percent'.
And 'scroll depth direction' allows us to track 'vertical' or 'horizontal' scrolling.
Now that we've enabled the variables it's time to configure our tag, so let's select
'tags'...
And click 'new' at the top of the window...
Let's name our tag 'Scroll Depth'...
And select 'Universal Analytics' as the 'tag type'.
Now we need to select 'event' as the 'track type' because we want to track the scroll
percentages as events into Google Analytics.
Next we need to name the event category.
I'm want scroll depth reported as 'Scroll' in my reports, so I'm going to keep things
simple and enter 'Scroll' as the category.
Now I'm going to click the variable icon for the event action...
And select 'scroll depth threshold'.
This will return the value from the data layer as people scroll, so 25, 50, 75 and 100.
Then we need to add 'percent' after this, so that we see '25 percent' in our reports
and not just '25'.
Since event tracking if flexible, you could choose to send the scroll depth percentage
as the event label and then set another value as the event action.
However, you won't really be gaining any additional insights by doing this, but it's up to you.
I've also seen people set the page as the event action, but this is automatically reported
in the Google Analytics events reports, so it's not necessary.
Now I recommend setting 'non-interaction hit' to 'true'.
This will ensure that you're not impacting the bounce rate in your reports.
I think this is really important and I know you could argue that people scrolling to the
bottom of your pages shouldn't be considered a bounce, but the definition of a bounce is
a session with a single page view.
So I like to ensure bounces and bounce rate remain the same in my reports.
Then we need to select our Google Analytics settings - this is the tracking ID from Google
Analytics.
And now that we've configured the tag we need to create the firing trigger, so that the
tag sends data to Google Analytics.
Let's click the plus sign to create a new trigger...
I'm going to name the trigger 'Scroll Depth'...
And select 'scroll depth' as the trigger type...
Now we can enable the option to track vertical scroll depth...
And we can choose the option to track 'percentages'...
There is also the option to track pixels - you could use this if you wanted to track people
scrolling at least, say, 800 pixels down each of your pages.
Again, I recommend using percentage as your pages are likely to be different lengths.
You can then use the event reports, or even create a segment to only view users that view
at least 50% or more of your pages.
Now we just need to enter the scroll depth percentages that we want to track.
I'm going to enter 25, 50, 75 and 100.
This allows us to track each of those points as people scroll our content.
I want to track scroll depth on all the pages of my website, so I'm going to leave this
to 'all pages', but if you only wanted to track scroll depth on certain pages, you can
select 'some pages' and then add your conditions.
For example, you could select 'page path', then 'matches regular expression' and enter
caret, forward slash, blog which means you would only match your blog pages.
I'm going to select 'all pages' for my trigger...
And I'm going to click 'save'...
Now I can preview the tag...
And let's navigate to a page on my website...
And click 'refresh'...
We can see the tag in the debug console...
Let's select the 'Data Layer' tab...
If we now scroll down the page, we can see the the data layer updates with the 25 percent
threshold...
Then the 50 percent threshold...
The 75 percent threshold...
And the 100 percent threshold...
And selecting the 'tags' tab shows us that the 'Scroll Depth' tag has been triggered
4 times.
Now let's head into Google Analytics...
We can now see that scroll depth has been reported into the real-time reports...
And we will begin to see data become available in the 'events' reports under 'behavior'...
The 'top events' report will allow you to select 'Scroll' to see your scroll depth numbers...
And if you want to see the pages people are viewing you can add a secondary dimension
of 'page' to the report...
I also recommend creating your own segment to view how scroll depth impacts the other
metrics on your website.
Finally, it's also worth checking that you're not already tracking scroll depth using another
solution.
For example, if you have custom javascript that you've been using to track scroll depth,
then don't forget to remove this before publishing your new tag.
// So that's how you can track scroll depth into Google Analytics using Google Tag Manager.
If you're just getting started, then I recommend using the Tag Assistant plugin for Chrome
and the Google Analytics real-time reports to check that your event tag is being fired
as you scroll.
You can also configure Google Tag Manager to track other interactions, including people
watching embedded youtube videos, downloading files and clicking outbound links.
Watch my video on tracking events for a quick way to automatically track custom interactions
into Google Analytics.
Are you using the new scroll depth trigger in Google Tag Manager?
I'd love to know!
Let me know in the comments below!
If you found this video helpful, then please like it, so I know to make more videos like
this.
See you next time!