Although many of us will have Google Analytics set up on our website and have taken time to learn the basics, there are countless tips and tricks that make the free platform even more efficient when trying to track website behavior.
Understanding analytics and adopting a data-driven mindset is critical in today’s businesses.
A key challenge for many developers comes when tracking user journeys.
For example, how do you know when a user clicks on a phone number or downloads a PDF if they are all on the same page? These are important metrics to manage.
In this blog, we will show you how to better track user journeys using a technique known as “virtual pageviews.”
What is a Pageview?
Google defines a pageview as a view of any page being tracked by Google Analytics. For example, if a customer visits the homepage, goes to a product page and then back to the homepage, it will show as two homepage views. Essentially, it is triggered whenever the GA(‘send’,’pageview’) Javascript is evoked on your website.
What is a Virtual Pageview?
A virtual pageview registers the same result but without the need to load a page, hence the virtual part. It is another piece of Javascript that is evoked to almost fake a page view that we can track within the Google Analytics platform. Perhaps the best way to explain the virtual pageview is through a practical example.
Imagine you have a nice Contact Us form on your website like below.
The form will most likely have its own domain such as www.yourdomain.com/contact-us.html/.
However, what do you do if you want to track form submissions as a conversion goal? The answer is to add a virtual page view by tagging the html form code. A page doesn’t actually exist when somebody clicks submit but your code makes Google Analytics believe that it does.
A typical html form code would look like below:
When you want to add your virtual page view to the code, it is a very simple edit.
You will see here that we have told the form submission to tag itself as the vpv/contact page when the button is clicked. In Google Analytics, this means the page named vpc/contact will show as having a pageview. We can now use that page to track conversion of the form as one of our goals on Google Analytics.
This is one of the most common examples of when a virtual pageview is used but others might be:
- Downloading a file to track the number of downloads
- Scrolling through a single page website to track the elements that customers are viewing
- Pop-up and lightbox success/loads
- Newsletter subscription conversions
- Loading of ajax contents
In most case you will be using Universal Analytics and the Javascript version of the above will look similar to the below as opposed to the default of ga(‘send’, ‘pageview’)
ga(‘send’, { ‘hitType’: ‘pageview’, ‘page’: ‘/vpv/contact/’, ‘title’: ‘Contact Us Submitted’ });
Once upon a time, creating virtual pageviews involved some sort of development to your website like the amendments to the form code noted above. However, since Google Tag Manager is often used to deliver Google Analytics tags, we are going to show you how to setup virtual pageviews using this preferred method.
How to Setup Virtual Pageviews?
In this guide we will assume the virtual pageview is being set up for when a user clicks on a link to begin downloading a file.
I will also assume that you have taken the time to setup your Google Analytics in Google Tag Manager.
First, find the page that you want to send the virtual pageview from (the one with the link) and ensure you note the URL. Once you find the download link, you will need to get the ID of the element or if there isn’t one, ask a developer to add one for you. A trigger in Google Tag Manager can then be set up that checks for clicks on the download link and then sends the pageview through to Google Analytics.
Finding the Element
If you are using Google Chrome, you will need to inspect the page to find the ID of the clickable link that you want to add to Google Tag Manager. You can do this by right clicking on the link and going to Inspect the element. Depending on your version of Chrome, the menu should look like the image below.
The code from the page will give you the ID of the element that should be added to Google Tag Manager later against the URL of the page. The ID will appear after the “<a” part of HTML script where it references your download link.
In this case, the ID of the link we want to tag for the virtual pageview is “resouceDownload.”
Setting Up Your Virtual Pageviews in Google Tag Manager (GTM)
You can now go to Google Tag Manager and set up the virtual pageview tag for your clickable link. See the screenshot below which shows how you would go about setting this up.
This is telling us that we have set up a trigger called “Check for click on download link.” Which enables when the page URL equals the one we noted earlier (wherever your link is). The trigger will fire when the Click ID is the same as the ID of our element that we got from the source inspection within the last step.
If you are not sure how to setup triggers or what they are within the Google Tag Manager platform, there are plenty of online resources. The link below provides a comprehensive guide for beginners.
https://www.optimizesmart.com/understanding-triggers-variables-google-tag-manager-v2/
The next step is to set up a new tag with a configuration similar to the below screenshot.
Within the above, there are various fields that the user is required to set.
campaignMedium – you can set user activity as the medium for the virtual pageview. Typically, you will see tags like organic, ppc and direct in the medium field of Google Analytics to represent how the user came to the site or page. For a virtual pageview, you may want to use a customized attribute like this so it is easy to differentiate. If you do not specify a medium, it will show as “(none)” which is quite useless and hard to track properly.
campaignSource – in Google Tag Manager, the campaign source field is designed to specify a marketing campaign. In this instance we called used “link click” as the source as it is that user activity which creates our goal. Traditionally, Google Analytics will report things like Google, Facebook, email or Bing as the source which would not make sense in the context of a virtual pageview. If you don’t specify the source, it will just show as “{direct}” making it misleading and hard to report on.
Page – the page variable specifies a portion of the URL that you have set up for the virtual pageview. As Google Analytics does not split out a regular page from a virtual page, developers setting this up tend to add the word “virtual” to the URL to make it very obvious. It is a good idea to come up with a naming convention of some sort if you intend on having multiple virtual pageviews setup.
Title – As well as the URL, you can set up a distinctive title for your virtual pageview. Again, it is good practice to have the word Virtual in the title to make tracking easier and for setting up better reports within Google Analytics.
Once everything is setup, you can check the Google developer console to ensure the data is tracking correctly and all of your elements are displaying as you would expect.
If everything is showing as expected, the virtual pageview is setup correctly.
Naming Conventions for Virtual Pageviews
When setting up the virtual pageview in Google Tag Manager, we briefly mentioned naming conventions and the importance of having a level of consistency. There are five key things to keep in mind when doing this.
- Descriptive names – If somebody was to look at the name of the page, they need to be able to instantly tell that it is a virtual pageview and not a separate page.
- Consistent name – However you decide to make them descriptive, for every virtual pageview it is important to follow the same method so that the names are consistent.
- Use the word “virtual” somewhere within the description to clearly flag the pages within Google Analytics as you track them. It will also make more sense when trying to setup goals.
- Try to determine all of the different interactions for which you might need virtual pageviews. It is a good idea to plot out an entire journey to get an end-to-end picture of what is going on. This is maybe more applicable if you have a single page website and need to track the flow.
- It is advisable to set something up using MS Excel or Google Sheets to show the hierarchy of your website and how the virtual pageviews need to be setup. This might involve listing every page and the links that exist on it to ensure you don’t miss anything. Whatever formatting or standard you use needs to be scalable as websites and link are forever changing.
All-in-all, whatever you decide to do, it must be easy to report on. It is unlikely that the Google Analytics users are the same people that setup the code or used Google Tag Manager, making it pivotal that they talk to each other.
Setting the Virtual Pageview as a Goal in Google Analytics
We are not going into huge detail about setting up goals in Google Analytics here. If you need a guide for this, there are many resources online. Have a look at the guide provided by Google on the link below.
https://support.google.com/analytics/answer/1032415?hl=en
Just like any goal that is setup in Google Analytics, you can assign a monetary value to a virtual pageview. It might not always be 100% clear what that is e.g. if somebody downloads a file but it is good to have a metric created.
In Google Analytics, you will be able to track your goal and the virtual page will show amongst the Content Drilldown section, in with all the standard pages you have got setup.
Virtual Pageview or Events
Some experts have said that it is far simpler to set up events in Google Analytics and Tag Manager rather than spending the time setting up numerous virtual pageviews. Whilst that may be true, the big advantage of a virtual pageview is within funnels and goal tracking. Funnels cannot be set up for event type goals and events cannot be the steps of a conversion funnel either. This is where having a standard setup for virtual pageviews pays off, in that they allow full tracking of your website journey for optimization purposes.
Events definitely have a place when you want to track specific user activities but virtual pageviews are much better when the interactions include the potential for many URLs or pageloads.
Summary
Virtual pageviews are an integral way of tracking customer behavior without having to create new URLs or moving between third party sites (such as a checkout). In the same way as any other page, you can ensure goals, conversions and bounce rates are tracked to best optimize your website content. It is important that users of Google Analytics make the most of all the tools available to them.
