Analytics Recipe Cookbook - Summaries

Implementing History Change Trigger in Google Tag Manager

  • 1.  Implementing History Change Trigger in Google Tag Manager

    Posted 03-30-2020 03:06 PM


    Have you ever wondered how single-page application using frameworks like Angular , VUE , React track page views ?
    Since all the necessary code for these frameworks are loaded once during the entire user session, how are these pages tracked?
    Have you noticed only one page-view in your GA reports?
    Have you wondered what are Single Page Applications, and how the tracking differs compared to multiple page tracking?
    Luckily , using the History Change Trigger in Google Tag Manager , we are able to track the single-page application page views. As the History Listener in GTM is designed to be used on websites where content is loaded dynamically.

    Analysis Overview:  

    In this recipe, we are going to - 
    • explain about single page applications.
    • walk you through the steps involved in implementing History Change Trigger in Google Tag Manager.
    • understand the difference in single-page application and multi-page application.

    Analysis Benefits: 

    1.  In Single Page Applications,using this recipe resolves the issue of only first page tracking or duplicate tracking of the first page.
    2. As there is no page reloads in SPA , other than the initial page load , using this recipe subsequent page views which aren't tracked  by the traditional method page view, are tracked.
    3.  Eliminates issues like campaign information overriding, accidental data inheritance, DOM state uncertainty by using GTM to track the SPA.

    DAA members, go here to view full recipe.

    Esteann Afonso
    Software Engineer
    Nabler (Corporate Account)
    OneConference 2020

  • 2.  RE: Implementing History Change Trigger in Google Tag Manager

    Posted 06-04-2020 12:40 AM
    Hey Esteann thanks for the article/post.

    I work on a daily basis with Angular Websites and I always need to find solutions on tracking. I've went over the history change in the past and is very helpful for SPA. Although in our projects we've decided to go with another solution: Virtual Pageviews(VPV). The difference were that we are using Angular for an E-commerce type of solution, where there are more than one page but no Pageview being sent to GA. It works wonders, but it creates an extra layer of effort for the Analytics and Development team every time.

    I'd love to contribute on how we implemented this solution.

    Thank you,
    Bruna Cunha

    Bruna Cunha
    Miami FL

    OneConference 2020