This article goes through the process of setting up conversion tracking (bookings) using Google Analytics for the Widget Configurator.
The conversion tracking for the widget works by redirecting the user to a confirmation page. This page only gets visited by people who complete a booking and, so, it can be used for conversion tracking.
All of the tracking will be done through your website, which means you have complete control over it.
While this article covers the full process, you also have the option to watch a video which goes through the same steps.
Before we start...
It's important that your widget is embedded in a standard way. If it uses the IFrame method (more on this in the video above) you won’t get correct sources for bookings and your booking success step won’t look correct to the users.
1. Make sure your website has Google Analytics tracking embedded on all pages.
Tracking all of your website pages is especially important if you want to see the correct booking sources.
You can check the tags yourself or ask your web developer to confirm that you have Google Analytics tracking across your website.
2. Create a booking confirmation landing page.
You will need to create a page that people will land on once the booking is complete. The page can be called or contain any information you want (e.g. www.restaurant.com/booking-successful/). The only requirement is to have your Google Analytics tracking code embedded on it.
If your website is managed by a web developer, please ask them to create this landing page and make sure it has Google Analytics code embedded on it.
3. Add the custom landing page to the widget
Navigate to your diary -> Promote -> Widget Configurator -> Edit your theme -> Theme Settings tab
Make sure to tick “Use customer success page” and specify the landing page you made in the last section.
Make sure to click Continue to save your changes.
4. Set up a Goal Conversion on Google Analytics
In order to identify which web traffic channels (e.g. Facebook, Twitter, organic search, etc) our booking are coming from, we need to set up a goal.
Navigate to your Google Analytics account (analytics.google.com) -> select the account and view your tracking is set up on -> go to Admin panel -> select Goals menu item
Select Custom -> click Continue -> give it a name e.g. “Bookings” -> select Destination as the type
On the “Goal details” part -> set “Destination” to “Regular expression” and specify your success page’s path url you made before. Path URL means that you don’t need to specify the hostname e.g. “www.restaurant.com/booking-successful/” would be just “booking-successful”.
If your booking success page has been visited in the past few days, you can click “Verify this Goal” to see if everything is set up correctly. Google Analytics has a delay between when the data is collected and available for use, so this won't work with very recent data.
5. Check the results
Goals in Google Analytics only show data from the point the goal was set up. Please give it a day or two for some data to be collected before checking.
Go to your Google Analytics property -> Acquisition -> All Traffic -> Channels
Make sure to select your bookings goal (the name will depend what you used in the previous step).
If everything was done correctly, you should get a breakdown of traffic sources similar to this:
(click on the image to zoom in)
What if I want to track conversions on Facebook Pixel, Google Ads, Twitter Ads, etc?
Since all of the tracking is done through your website, you can set up any other tracking in the same way you setup your Google Analytics. Just add the tracking code to your custom success page or across the website, depending on the type of tracking you have.
We have separate step by step guides for Facebook and Google Ads:
Could I track conversions without a custom success page?
Yes, we have a guide on how to set it up:
What if I already have Google Analytics or GTM code specified in the diary?
To check if you already have any tracking codes added to the widget go to: Your diary -> Settings -> Reservations -> Widget and Portal Tracking. If any of the fields have an ID specified, it means you are tracking it.
If you have your Google Analytics ID specified there, it means that the page on which the widget is embedded will execute Google Analytics tag twice. This could affect the accuracy of your reporting. It’s best you have just one tag being fired so removing it from the diary might be the best option for you.
If you have Google Tag Manager ID specified in the diary and you are running the same container (GTM ID) on your website, some of the tags might double fire. It is best to have just one unique GTM container running on your page, but it should be fire as long as you have separate tracking tags on each.
What if I want to fire custom tags on the widget whilst also using my website’s tags? (advanced)
The widget often loads later than the page so you might not be able to run custom tracking tags that could track behaviour on the widget.
In order to accommodate the custom tagging on the widget, you can use a separate Google Tag Manager container and specify it on the diary settings. It means your website will have a container with tags applicable to it and the widget will have its own custom tags applicable just to it. This setup can prevent double counting.