There are 6 steps required to successfully configure pageview tracking:
- Create a new Google Tag Manager (GTM) container.
- Add the Google container ID to the diary settings.
- Create custom variables.
- Create a custom trigger.
- Create a new tag.
- 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:
|/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|
Step 7 Set up Google Analytics goal
Go to your google analytics property > admin panel > Goals > create a new goal with the following parameters: