DTM implementation on a single page (AngularJS) site.

Avatar

Avatar
Validate 1
Level 1
paul_volk
Level 1

Like

1 like

Total Posts

7 posts

Correct reply

0 solutions
Top badges earned
Validate 1
Boost 1
View profile

Avatar
Validate 1
Level 1
paul_volk
Level 1

Like

1 like

Total Posts

7 posts

Correct reply

0 solutions
Top badges earned
Validate 1
Boost 1
View profile
paul_volk
Level 1

15-10-2015

Hey Community,

Does anyone run an AngularJS (or similar single page experience) site with Adobe Analytics implemented via DTM. I'd like a good example to base my implementation on. If you have any documentation or best practices to share regarding DTM and angularJS please also let me know. Thanks in advance!

View Entire Topic

Avatar

Avatar
Validate 1
Level 4
Harsh_Kabra
Level 4

Likes

27 likes

Total Posts

56 posts

Correct reply

28 solutions
Top badges earned
Validate 1
Boost 5
Boost 3
Boost 25
Boost 10
View profile

Avatar
Validate 1
Level 4
Harsh_Kabra
Level 4

Likes

27 likes

Total Posts

56 posts

Correct reply

28 solutions
Top badges earned
Validate 1
Boost 5
Boost 3
Boost 25
Boost 10
View profile
Harsh_Kabra
Level 4

18-07-2017

Hey Paul,

From my personal experience, implementing Adobe Analytics via DTM on a single page app is always little TRICKY. This implementation would require a lot of quick and dirty fixes, especially when you have a complex implementation with a lot of customization.

Before I suggest the possible fix to your problem, disclaimer, I am NOT a JS expert so my solution would be more focused on Analytics Implementation workarounds than the Single Page App frameworks like Backbone.js etc

Below code might be a good example in Angular JS to capture the Page Views (not the literal page view but view changes):

$rootScope.$on('$locationChangeSuccess', function(event, url, oldUrl, state, oldState){

    var currentURL =url.toLowerCase().toString();

    var dataLayer={};

    if(currentURL.includes('ABC')){

     dataLayer= {

            'pagename': 'ABC View'    

        }

_satellite.pageBottom();

       }

else if(currentURL.includes('XYZ')){

       dataLayer = {

            'pagename': 'XYZ View'         

        }

_satellite.pageBottom();

}

Hope this helps and Don't forget to like this comment

Thanks,

Harsh Kabra |  Adobe Certified Expert: Analytics Architect ®

Certified_Expert_Adobe_Analytics_Architect_badge.png