Google Tag Manager is a tool that allows you to manage and deploy marketing tags (snippets of code or tracking pixels) without having to modify or update code in the backend of a website.

Marketers will connect their Google Analytics account to Tag Manager and have Tag Manager send page view data back to Google Analytics. This circumvents the need to add separate analytics tracking scripts to each page and allows for the management of tracking events in a single location.

Our WordPress plugin Ajax Load More offers functionality that dynamically updates the browser URL when you perform a load more action on a page or post – wouldn’t it be nice if you could send these (virtual) page views back to Google Analytics?

The good news is with Tag Manager you can! In this article, we’ll dive into tracking virtual page views in Google Analytics when dynamically updating the browser URL.

Note: This article assumes you have working knowledge of Tag Manager and already have a Google Analytics account set up and connected via tracking ID.

Start Tracking Virtual Page Views

A virtual page view is a hit (or view) on your website that occurs without reloading the page. On sites that make use of Ajax for infinite scroll or load more functionality, it may be important that each action registers a page view when additional content is loaded or a URL is updated.

There are 3 steps involved in the tracking of virtual page views in Google Analytics with Tag Manager.

  1. Enable Built-in Variables
  2. Create Triggers
  3. Define Tags

1. Variables

The first step is to enable the Built-in Variable, New History State under the Variables > Configure section of the Tag Manager admin console.

Tag Manager Variable Listing

The New History State variable will instruct Tag Manager to listen for URL changes and perform actions based on URL history changes.

2. Triggers

In Google Tag Manager, a trigger listens to your web page for certain types of events like page views or button clicks. A trigger tells the tag to fire when the specified event is detected.

The next step is to create a Trigger that listens for a History Change event. Under Triggers, click New and select the History Change Trigger Type.

Tag Manager Triggers Listing

With the History Change Trigger in place, you can go forward and create the Tag that will be used to dispatch the Page Views.

3. Tags

The final step is to configure a custom Tag that will trigger a page view each time the browser URL updates.

Under Tags, click New to open the options menu and complete the Tag Configuration and Triggering sections as seen below.

Tag Manager Tag Configuration

Tag Configuration

  • Tag Type: Google Analytics: Universal Analytics
  • Track Type: Page View

Triggering

  • History Change

What we have is a Tag that is set up to dispatch a new page view to Google Analytics each time the browser history changes.

I’ve gone ahead and named the new Tag URL History Change so it’s clear on the dashboard when this Tag will be dispatched.

Tag Manager Tag Listing

And that’s it, you should now see your new URL History Change tag listed on the dashboard. Don’t forget to save and publish the changes made before exiting Tag Manager.

Once you’ve completed the steps above, Tag Manager should be set up to send a virtual page view to Google Analytics each time the browser URL is updated.

Testing

A quick way to test that you have everything set up and configured properly is to use the Realtime view in Google Analytics. Realtime provides a live look at the current traffic on your website.

  1. Visit Realtime > Overview in the Google Analytics dashboard.
  2. Open your site where Tag Manager is present and confirm your current page is listed under Active Pages in Google Analytics.
  3. Perform an Ajax action on the page where the browser URL updates without a page refresh.
  4. Confirm the URL updates under Active Pages in Google Analytics.
Google Analytics Realtime Live View

If the URL is not updating go back into Tag Manager and double check your Trigger and Tag are set up to dispatch a Page View on New History State.

Wrapping Things Up

On Ajax heavily sites that modify or update content and the browser URL, tracking virtual page views can be vital in determining the amount of traffic a post or page is actually receiving.

Do you have any Tag Manager or Google Analytics-specific questions or suggestions? Leave them in the comments and I’ll do my best to help out!

Comments

9 thoughts on “Tracking Virtual Page Views with Google Tag Manager”

  1. Avatar

    programacion@starenlared.net

    October 23, 2024 @ 6:23 am
    Reply

    Hi, it works almost perfectly, but the first time it loads the next post it comes up with the same title and image as the initially loaded post. How can you make it so that it doesn’t reload the first post that is being visited?

    Thank you.

  2. Avatar

    Nathan

    April 01, 2021 @ 12:42 am
    Reply

    Apart from the Real Time…Can we find that event anywhere else in Google Analytics? I can track that real time data without even creating an Trigger.

    1. Avatar

      Darren Cooney

      April 03, 2021 @ 11:34 am
      Reply

      The Real-Time view in GA will not update unless a page view has been dispatched. So when dealing with Ajax loaded content and you want to track additional page views after the initial page load you need to tell Tag Manager to do so.
      That’s what this article is explaining.

  3. Avatar

    Hector

    August 24, 2020 @ 6:24 pm
    Reply

    hi Darren,

    Thanks for the article!
    Quick question, why you left both the History Change and the Page View triggers on the GA tag?

    Cheers from México!

    1. Avatar

      Darren Cooney

      September 02, 2020 @ 11:40 am
      Reply

      Hi Hector,
      The PageView is what is dispatched from the History Change event.

  4. Avatar

    cyril

    May 26, 2020 @ 11:01 pm
    Reply

    Hey Darren,

    Thanks for clearly explaining, it took me a while to set this up.
    Also one question, It looks like it is working for me as I can now see urls like category/page/4.
    So I’m guessing it is counting the new page views, also how can I differentiate them now from my other page views ?

    I stumbled on other tag technics to do it with custom events or the new visibility elements.
    And it seemed that you could change the url like: virtual/ or virtual- to your urls so you can differentiate them in GA.
    Like here (https://medium.com/@MrKennedy001/tag-manager-virtual-page-view-with-google-analytics-data-7696d6bd4142)

    Is it also possible with this technic?
    I’m just afraid it will inflate the page views (great) but it will be very hard to differentiate no?

    1. Avatar

      Darren Cooney

      June 02, 2020 @ 3:27 pm
      Reply

      Hi Cyril,
      Good question, I’m not quite sure how you differentiate these page views. In my opinion they shouldn’t be unique as the user is actually viewing paged data.

      I’ll have to check out this link you posted and see what can be done about that.

  5. Avatar

    Adrian

    May 06, 2020 @ 12:43 am
    Reply

    Hi.
    What I don’t Understand is why enable New History State if we never use it on a Trigger?

    1. Avatar

      Darren Cooney

      May 06, 2020 @ 9:46 am
      Reply

      Hi Adrian,
      The History Change Trigger is listening for the New History State that we defined in step 1. It’s fired when the URL updates.

Leave a Reply

Your email address will not be published. Required fields are marked *