Once you have your Google Tag Manager account set up to your liking, installing it on your web booking page couldn't be easier. Simply navigate to the Workspace you wish to use and click on your tag manager ID. This will display the tracking code you'll need in a moment:
Next, in Caterbook, navigate to the booking template editor (Settings / Property / Booking template), scroll down to the Scripts and URLs section, and check the box to Enable Google Tag Manager. This will reveal three text entry boxes - two for your Tag Manager code and one for your optional custom booking confirmation page:
Copy each snippet of code from your Google Tag Manager account and paste it into the relevant box. Scroll back up the page a little and hit the Save button and you're done! You can now begin tracking traffic on your web booking engine.
You also have the option of creating a custom confirmation page which will allow you to track the customer journey right through to conversion. This page will return the booking details such as reference number, arrival/departure dates and booking value in the URL and will allow you to parse this information in a Javascript. An example of the attribute-value pairs in this querystring would be as follows:
http://hotelqueste.co.uk/success.html?bookingID=213139&arrival=01/04/2020&departure=02/04/2020&value=60
As you can see here, we have the bookingID element, along with the Caterbook booking reference, the arrival and departure date elements in the format of DD/MM/YYYY, and the value element which represents the total booking value.
This page would be a good place to add any additional tags that you might require.
Using the Google Tag Assistant plugin for Chrome is a great way to make sure the tags are working correctly. As you can see here, we have successfully tracked a guest booking right through to the confirmation page, which has returned the attribute-value pairs for this booking in the URL: