There are 6 steps required to successfully configure pageview tracking:


  1. Create a new Google Tag Manager (GTM) container.
  2. Add the Google container ID to the diary settings.
  3. Create custom variables.
  4. Create a custom trigger.
  5. Create a new tag.
  6. Preview and test.

Important: you can skip the first 2 steps if you have already created a container with a GA tag.


Step 1 Create a new GTM Container


Log in to your Tag Manager account at tagmanager.google.com where you will be presented with a list of your current containers. Click on the three ellipses at the top right hand corner and choose ‘Create Container’



Enter a container name of your choice and choose the Web type.





Step 2 Add the Google container ID to your diary settings


Note the ID of your new container (GTM-xxxxxx) and in your diary go to:  

Settings > Restaurant > Details > Other Details > Widget Tracking 

Choose Tag Manager as the Tracking Type and enter the ID of your new container:








Step 3 Create custom variables


Return to Google Tag Manager and click on the newly created container in your containers list to go to the container workspace.






On the left-hand sidebar, click on Variables and then click on the New button in the User-Defined Variables section:






Then click on the icon in the Variable Configuration section and choose a Data Layer Variable from the list of variable types:






Then configure the variable as follows:





Important: Variable names are case sensitive.



Repeat the steps above to create a second custom variable named virtualPageTitle.



 

Step 4 Create a custom trigger


On the left-hand sidebar, click on Triggers then click on the New button and finally click on the icon in the Trigger Configuration section:


 

Choose Custom Event from the list:





Complete the configuration as follows:




 

Step 5 Create a new tag


On the left-hand sidebar, click on Tags then click on the New button and finally click on the icon in the Tag Configuration section:





Select Universal Analytics from the Tag Types list:





Configure the tag as below, selecting  ‘New variable…’ from the Google Analytics settings dropdown.




Configure the new variable as follows, entering your own Analytics Tracking ID:

Important: please specify the actual Analytics Tracking ID (not a user-defined variable) e.g UA-XXXXXXX


 




Finally, click on the Triggering icon and chose the custom VirtualPageview trigger created earlier:





 

Step 6 Preview and test


Click on the Preview button in the Tag Manager workspace and then, in another browser window, load the page that contains the widget to be tested. Create a booking in the widget and as you proceed through the booking process you should see that a Virtual Page View event is fired on each page:

 




The widget has been configured to send virtualPageURLs and virtualPageTitles on each page as follows:

 


virtualPageURL


virtualPageTitle


/resdiary-widget/venueSelection
Select a venue
/resdiary-widget/initial
Select covers, date and time
/resdiary-widget/promotion
Select a promotion
/resdiary-widget/contact
Enter contact details
/resdiary-widget/confirmation
Confirm booking request details
/resdiary-widget/success
Booking was successful
/resdiary-widget/payment
Enter credit card details
/resdiary-widget/error
Error details


Step 7 Set up Google Analytics goal


Go to your google analytics property > admin panel > Goals > create a new goal with the following parameters: