How to Setup Page Scroll Using Google Tag Manager

Checking Google Analytics. Credit: Myriam Jessier
Checking Google Analytics. Credit: Myriam Jessier

A digital marketer or a business decision-maker can easily make decisions based on landing page or content by enabling the Page scroll depth. This event helps us to understand how deeply the website visitors scroll the page. It will be 25%, 50% , 75% and 100%. The team can workaround based on this.

Steps to configure page scroll with Google Tag Manager

Step 1: Enable Built-in Scroll Variables

To do this, go to Variables in Google Tag Manager and then enable the ‘Scroll Depth Threshold’, ‘Scroll Depth Units’ and ‘Scroll Depth Direction’ variables. To do that, click configure and then select these from the list.

Step 2: Create a Tag 

Click on the tag and then create a new tag. Select Universal Google Analytics as tag type and then event as track type. Choose the name Scroll as Category and for ‘Action’ click the Variable icon (+) and then select the variable “Scroll Depth Threshold” from the list. Add a percentage symbol after the variable and now it should look like this.

{{Scroll Depth Threshold}}%

And for “Label,” you can choose the “page path.” Set the Non-Interaction Event as True. So Google Analytics will consider that the user does not initiate this interaction. Now it will not affect the bounce rate. After this, then select the Google Analytics settings. The next step is to create the trigger for this tag

Step 3: Create a trigger 

Select the + symbol at the top right to create a new trigger and click the pencil icon to choose the trigger configuration. Select “Scroll Depth” as Trigger type. Here we have both Vertical and Horizontal Scroll. Where you can choose either percentage (25%, 50%,50%,100%) or Pixel (769, 0124, 1441). Then You can choose the tag fires on either “All pages” or “Some pages” (Eg: You can set to fire this trigger only on blog pages) based on your requirements.