Tag Manager Virtual Page View with Google Analytics Data
Google Tag Manager is a use-full tool but can also be tricky to implement GA Analytics for Goal Tracking. Here is a short explanation of my implementation.
“Pageview tracking” counts actual and virtual pageviews. … “Event tracking” supersedes the pageview functionality of Google Analytics. However, websites may still use this feature if they only want to track the number of document downloads or clicks on external links.
In Google Tag Manager create a new container and get the Container ID (don't forget to include the tag manager script on your site)
GTM-XXXXXXX
Next, we need to set up Tag Manager to work with Google Analytics by Adding a Google Universal Setting Variable. Under your new container navigate to variables and add a New variable with Google Analytics Settings as the variable type.
Now we register a normal page view by adding a new Tag & Trigger, under Tag Type select Google Analytics Universal Analytics, leave track type as pave view and under Google Analytics Settings choose the Variable you have just created.
Then directly below your Tag add a Trigger with Page View as Type
If you have done everything correctly you can visit google analytics and under RealTime you should see your self as a visitor once you browse your website.
What this does is add an event: VirualPageView to the Data Layer along with two more Custom Variables virtualPageTitle & VirtualPageURL these will be mapped to page title and page URL under analytics.
So under Variable add Three new Data Layer Variables
Now again under Tag select New and Use Google Universal Analytics as a Type except this time we need to select Enable Overriding and assign our variables to the page & title under more settings > Fields to set.
Save and then Create a new trigger below using Custom Trigger as type also set this trigger fires on as per below
Save all settings and Submit & Publish your container.
Now to test your settings build a simple test page and add this script within
<div onclick=”triggerView(1)”>PageView 1</div>
<div onclick=”triggerView(2)”>PageView 2</div>
<script>function triggerView(id){ window.dataLayer.push({ ‘event’:’VirtualPageView’, ‘virtualPageURL’: ‘/page/article_’+ id +’/success’, ‘virtualPageTitle’ : ‘Article ‘ }); console.log(window.dataLayer); };</script>
Now again visit the RealTime section of your Site Under RealTime Content you will see the page title Change when u click on the above triggers.
