Expand my Community achievements bar.

Join us at Adobe Summit 2024 for the Coffee Break Q&A Live series, a unique opportunity to network with and learn from expert users, the Adobe product team, and Adobe partners in a small group, 30 minute AMA conversations.
SOLVED

Page Name is not accurately capturing the correct page

Avatar

Level 1

I'm finding that my PageName variable is not reading the correct value. The app is a SPA Vue app, in Launch, the PageName is set as "%Path%%Hash%" and the Page Url is set as "%URL%".

What is happening is for example I am on my /pay/verify page, when I click on a link with an analytics call, the page name is supposed to register as "/pay/verify" however, it is reading as the next page that I arrive at, say "/pay/method" instead. In the click handler for the link, I have:
 

chooseVerificationOptions() { this.router.push({ name: ROUTES.METHOD })

What is the cause of this and what can I do? I can capture the current page name with window.location.pathname in my code. Can I pass this to a variable and send this to PageName directly? Any help is greatly appreciated. Thanks.

Topics

Topics help categorize Community content and increase your ability to discover relevant content.

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

For SPA I would use a direct call rule to indicate page navigation change(virtual pageview).

 

Then in data layer populate the pagename variable page to page. This way a beacon is set per page movement and not one step behind like you have now. It also allows for web browser reloads as well as back and forth arrows. The beacon method also allows you to enable button and link tracking to align with source page. SO when a link is clicked it is associated with correct originating page.(you don't need to make a seperate link click rule if using Activity Map)

 

Also another advantage of this methodology if the hash structure were ever changes the direct call rules would not be changed.

 

 

View solution in original post

1 Reply

Avatar

Correct answer by
Community Advisor

For SPA I would use a direct call rule to indicate page navigation change(virtual pageview).

 

Then in data layer populate the pagename variable page to page. This way a beacon is set per page movement and not one step behind like you have now. It also allows for web browser reloads as well as back and forth arrows. The beacon method also allows you to enable button and link tracking to align with source page. SO when a link is clicked it is associated with correct originating page.(you don't need to make a seperate link click rule if using Activity Map)

 

Also another advantage of this methodology if the hash structure were ever changes the direct call rules would not be changed.