Booknow 2.0 Google Analaytics
Introduction
This document outlines how to track e-commerce events for a booking engine using Google Analytics 4 (GA4). Your Google Analytics should be provided to your System Administrator to add to the Site in Content Manager or to the HTI Connectivity Team.
Google Analytics Triggers
1. Triggers
The below events will trigger within analytics,.
GA4 Event Tags and their Custom Event Triggers
Data Layer Implementation Examples
View results:
{
"0": "event",
"1": "view_results",
"2": {
"send_to": "analytics",
"event_category": "results",
"event_label": "view_results",
"item_list_id": "hotel_results",
"item_list_name": "Hotel Results",
"items": [
{
"id": "2506",
"name": "Sandy Hotel",
"best_rate": "1980.00",
"currency": "ZAR",
"result_position": 0
},
{
"id": "BON",
"name": "Bonis Hotel",
"best_rate": "2000.00",
"currency": "ZAR",
"result_position": 1
},
{
"id": "THU",
"name": "Ankhole Resort",
"best_rate": "Not available",
"currency": "N/A",
"result_position": 2
},
{
"id": "WOI",
"name": "White Orchard Inn",
"best_rate": "Not available",
"currency": "N/A",
"result_position": 3
},
{
"id": "ZZ",
"name": "Zonke Bonke Leisure",
"best_rate": "Not available",
"currency": "N/A",
"result_position": 4
},
{
"id": "Reg6",
"name": "Regression6",
"best_rate": "Not available",
"currency": "N/A",
"result_position": 5
}
]
}
}
View Item
{
"0": "event",
"1": "view_item",
"2": {
"send_to": "analytics",
"event_category": "clicked",
"event_label": "view_hotel",
"items": [
{
"id": "2506",
"name": "Sandy Hotel",
"best_rate": "1980.00",
"currency": "ZAR",
"result_position": 0
}
]
}
}
View Item List
{
"0": "event",
"1": "view_item_list",
"2": {
"send_to": "analytics",
"event_category": "room_rates",
"event_label": "view_room_rates",
"item_list_id": "room_rate_list",
"item_list_name": "Room Rates",
"items": [
[
{
"item_id": "DEL_AD",
"item_name": "Deluxe",
"item_room_id": "DEL",
"item_category": "Sandy Hotel",
"item_brand": "newbooknow",
"price": "1980.00",
"item_rate_code": "AD",
"currency": "ZAR",
"item_hotel_id": "2506"
},
{
"item_id": "DEL_RACKBB",
"item_name": "Deluxe",
"item_room_id": "DEL",
"item_category": "Sandy Hotel",
"item_brand": "newbooknow",
"price": "2200.00",
"item_rate_code": "RACKBB",
"currency": "ZAR",
"item_hotel_id": "2506"
}
],
[
{
"item_id": "PRES_AD",
"item_name": "Presidential Suite",
"item_room_id": "PRES",
"item_category": "Sandy Hotel",
"item_brand": "newbooknow",
"price": "1980.00",
"item_rate_code": "AD",
"currency": "ZAR",
"item_hotel_id": "2506"
},
{
"item_id": "PRES_RACKBB",
"item_name": "Presidential Suite",
"item_room_id": "PRES",
"item_category": "Sandy Hotel",
"item_brand": "newbooknow",
"price": "2200.00",
"item_rate_code": "RACKBB",
"currency": "ZAR",
"item_hotel_id": "2506"
}
],
[
{
"item_id": "STDR_AD",
"item_name": "Standard Room",
"item_room_id": "STDR",
"item_category": "Sandy Hotel",
"item_brand": "newbooknow",
"price": "1980.00",
"item_rate_code": "AD",
"currency": "ZAR",
"item_hotel_id": "2506"
},
{
"item_id": "STDR_RACKBB",
"item_name": "Standard Room",
"item_room_id": "STDR",
"item_category": "Sandy Hotel",
"item_brand": "newbooknow",
"price": "2200.00",
"item_rate_code": "RACKBB",
"currency": "ZAR",
"item_hotel_id": "2506"
}
],
[
{
"item_id": "TWN_AD",
"item_name": "Twin Room",
"item_room_id": "TWN",
"item_category": "Sandy Hotel",
"item_brand": "newbooknow",
"price": "1980.00",
"item_rate_code": "AD",
"currency": "ZAR",
"item_hotel_id": "2506"
},
{
"item_id": "TWN_RACKBB",
"item_name": "Twin Room",
"item_room_id": "TWN",
"item_category": "Sandy Hotel",
"item_brand": "newbooknow",
"price": "2200.00",
"item_rate_code": "RACKBB",
"currency": "ZAR",
"item_hotel_id": "2506"
}
],
[
{
"item_id": "LUX_AD",
"item_name": "Luxury Suite",
"item_room_id": "LUX",
"item_category": "Sandy Hotel",
"item_brand": "newbooknow",
"price": "1980.00",
"item_rate_code": "AD",
"currency": "ZAR",
"item_hotel_id": "2506"
},
{
"item_id": "LUX_RACKBB",
"item_name": "Luxury Suite",
"item_room_id": "LUX",
"item_category": "Sandy Hotel",
"item_brand": "newbooknow",
"price": "2200.00",
"item_rate_code": "RACKBB",
"currency": "ZAR",
"item_hotel_id": "2506"
}
],
[
{
"item_id": "EXKBNBkkhj_AD",
"item_name": "Executive King Bath No Balcony ",
"item_room_id": "EXKBNBkkhj",
"item_category": "Sandy Hotel",
"item_brand": "newbooknow",
"price": "1980.00",
"item_rate_code": "AD",
"currency": "ZAR",
"item_hotel_id": "2506"
},
{
"item_id": "EXKBNBkkhj_RACKBB",
"item_name": "Executive King Bath No Balcony ",
"item_room_id": "EXKBNBkkhj",
"item_category": "Sandy Hotel",
"item_brand": "newbooknow",
"price": "2200.00",
"item_rate_code": "RACKBB",
"currency": "ZAR",
"item_hotel_id": "2506"
}
],
[
{
"item_id": "ËXKBNB _AD",
"item_name": "Executive King Bath No Balcony ",
"item_room_id": "ËXKBNB ",
"item_category": "Sandy Hotel",
"item_brand": "newbooknow",
"price": "1980.00",
"item_rate_code": "AD",
"currency": "ZAR",
"item_hotel_id": "2506"
},
{
"item_id": "ËXKBNB _RACKBB",
"item_name": "Executive King Bath No Balcony ",
"item_room_id": "ËXKBNB ",
"item_category": "Sandy Hotel",
"item_brand": "newbooknow",
"price": "2200.00",
"item_rate_code": "RACKBB",
"currency": "ZAR",
"item_hotel_id": "2506"
}
],
[
{
"item_id": "GAR_AD",
"item_name": "Garden Room",
"item_room_id": "GAR",
"item_category": "Sandy Hotel",
"item_brand": "newbooknow",
"price": "2169.00",
"item_rate_code": "AD",
"currency": "ZAR",
"item_hotel_id": "2506"
},
{
"item_id": "GAR_RACKBB",
"item_name": "Garden Room",
"item_room_id": "GAR",
"item_category": "Sandy Hotel",
"item_brand": "newbooknow",
"price": "2410.00",
"item_rate_code": "RACKBB",
"currency": "ZAR",
"item_hotel_id": "2506"
}
],
[]
]
}
}
Add to Cart
{
"0": "event",
"1": "add_to_cart",
"2": {
"send_to": "analytics",
"event_category": "clicked",
"event_label": "add_to_itinerary",
"items": [
{
"item_id": "DEL_AD",
"item_name": "Deluxe",
"item_room_id": "DEL",
"item_category": "Sandy Hotel",
"item_brand": "newbooknow",
"price": "1980.00",
"item_rate_code": "AD",
"currency": "ZAR",
"item_hotel_id": "2506"
}
]
}
}
Edit Cart
{
"0": "event",
"1": "edit_cart",
"2": {
"send_to": "analytics",
"event_category": "clicked",
"event_label": "edit_itinerary",
"items": [
{
"room_id": "DEL",
"name": "Deluxe",
"category": "Sandy Hotel",
"price": 1999.8,
"rate_code": "AD",
"currency": "ZAR",
"hotel_id": "2506"
}
]
}
}
Add shipping Info
{
"0": "event",
"1": "add_shipping_info",
"2": {
"send_to": "analytics",
"event_category": "clicked",
"event_label": "add_guest_detail"
}
}
Begin Checkout
{
"0": "event",
"1": "begin_checkout",
"2": {
"send_to": "analytics",
"transaction_id": 5590,
"value": "2,038.96",
"tax": "260.84",
"currency": "ZAR",
"arrival_date": "2026-08-03",
"departure_date": "Tue Aug 04 2026 00:00:00 GMT+0200 (South Africa Standard Time)",
"items": [
{
"item_id": "DEL_AD",
"item_name": "Deluxe",
"arrival_date": "2026-08-03",
"departure_date": "2026-08-04",
"item_brand": "newbooknow",
"item_category": "Sandy Hotel",
"price": 1999.8,
"quantity": 1,
"item_hotel_id": "2506",
"item_rate_code": "AD",
"item_room_id": "DEL"
}
]
}
}
Payment Gateway Redirect
{
"0": "event",
"1": "ecommerce",
"2": {
"send_to": "analytics",
"event_category": "payment",
"event_label": "payment_redirect"
}
}
Page view confirmation:
{
"0": "event",
"1": "page_view",
"2": {
"page_path": "/confirmation",
"send_to": [
"analytics"
],
"hotel_id": "2506",
"brand_id": "newbooknow"
}
}
Purchase
{
"0": "event",
"1": "purchase",
"2": {
"send_to": "analytics",
"transaction_id": 5590,
"value": "2,038.96",
"tax": "260.84",
"currency": "ZAR",
"arrival_date": "2026-08-03",
"departure_date": "Tue Aug 04 2026 00:00:00 GMT+0200 (South Africa Standard Time)",
"items": [
{
"item_id": "DEL_AD",
"item_name": "Deluxe",
"arrival_date": "2026-08-03",
"departure_date": "2026-08-04",
"item_brand": "newbooknow",
"item_category": "Sandy Hotel",
"price": 1999.8,
"quantity": 1,
"item_hotel_id": "2506",
"item_rate_code": "AD",
"item_room_id": "DEL"
}
]
}
}
Payment Success
{
"0": "event",
"1": "ecommerce",
"2": {
"send_to": "analytics",
"event_category": "payment",
"event_label": "payment_success"
}
}
Payment error
{
"0": "event",
"1": "ecommerce",
"2": {
"send_to": "analytics",
"event_category": "payment",
"event_label": "payment_error"
}
}
2. E-commerce Data Layer Fields
Below fields are being added to the events and/or data layer
Custom Funnel Report G4A
To create a funnel report in GA4, you must use the Explorations feature. The "Funnel exploration" report allows you to visualize the steps users take on their path to a key conversion, such as a purchase.
How to Create a Funnel Report in GA4
Navigate to Explore in the left-hand menu of your GA4 property.
Click on Funnel exploration to start a new report.
Configure the Steps: In the "Steps" section, define the sequence of e-commerce events from the booking engine that you want to analyze. Use the event names you've set up, such as view_item_list, add_to_cart, begin_checkout, and purchase.
For each step, select an event and name it to match a stage in your funnel. For example:
Step 1: "View Item List" (Select the view_item_list event).
Step 2: "Add to Cart" (Select the add_to_cart event).
Step 3: "Begin Checkout" (Select the begin_checkout event).
Step 4: "Purchase" (Select the purchase event).
Refine the Analysis: You can add breakdowns, filters, and segments to analyze the funnel by different dimensions. For example, you could break down the funnel by item_brand to see the performance of "newbooknow".
Click Apply to generate the funnel visualization.
Understanding Your Funnel Report
The funnel exploration report will show you the conversion rate for each step, from the start of the funnel to the final purchase. You will see a bar for each step, representing the number of users who completed it, and the percentage drop-off between each step. This helps you identify where users are abandoning the booking process.
Payment Gateway
Measuring the Payment Gateway Drop-Off
This section explains how to use your existing GA4 setup to track and measure the point where users abandon the checkout process at the payment gateway.
Step 1: Set Up Enhanced E-commerce Tracking in GA4
First, ensure you have Enhanced E-commerce tracking configured in Google Analytics. This is a crucial foundation for understanding the checkout funnel. You'll need to send specific events from your website's data layer to GA4.
begin_checkout: This event should fire when the user clicks the "Continue to Payment" button on your checkout page.
purchase: This is the most critical event. It will fire only on the order confirmation page after the user has successfully returned from the payment gateway. The payment gateway must be configured to automatically redirect the user back to this specific page after a successful transaction. The data layer for the purchase event includes the transaction ID, total value, and item details.
Step 2: Create a Funnel Exploration in GA4
Once your events are set up and firing correctly, you can use the Funnel Exploration report in GA4 to visualize the user journey and identify the drop-off point.
Navigate to the Explore section in your GA4 property.
Start a new Funnel exploration report.
Define the steps of your funnel using the events you've configured. A typical e-commerce funnel might look like this:
Step 1: begin_checkout
Step 2: A page view event for your order confirmation page (e.g., page_view with page_path: "/confirmation").
Step 3: The purchase event.
Analyze the report. The funnel will show you the percentage of users who move from one step to the next.
How to Identify the Drop-Off
The "drop-off" you're looking for will be visible between two specific steps in your funnel:
The last step on your site before the user leaves for the payment gateway (e.g., the begin_checkout event or the page view of your checkout page).
The first step on your site after the user returns (the page view of your confirmation page).
You will see a significant drop-off rate between these two steps. This is your "payment gateway drop-off." The users in this group are the ones who clicked to go to the payment gateway but never returned to your site to complete the purchase.
Addressing Self-Referral Issues
A common issue with external payment gateways is that they can sometimes be recorded as the "source" of the conversion, which is inaccurate. To prevent this, you should add the payment gateway's domain to your Unwanted Referrals list in GA4.
In GA4, go to Admin.
Under Data Streams, select your web data stream.
Click on More Tagging Settings (or Configure tag settings).
Find List unwanted referrals.
Add the domain of the payment switch ( apps.hti.app) to this list.
By doing this, any traffic returning from that domain will not be considered a new session from a new source, and the original traffic source (e.g., Google Organic, an ad campaign, etc.) will be maintained.
Summary
You can't track the user on the payment gateway itself. The strategy is to track the user's actions before they leave your site and after they return. By creating a funnel in GA4 that shows the conversion rate between your checkout page and your confirmation page, you can accurately measure the drop-off that occurs at the payment gateway.
GTM
Google Tag manager script can be added to the page where Booknow runs, and events can be built to sent to analytics as needed.
Troubleshooting
Use Tag Assistant or Debug view to track events being sent:
Related Articles
Google Hotel Ads
BookNow and NebulaCRS Integrates with Google Hotel Ads, see below video for how it works Required: BookNow Video Content: BookNow and Google Hotel Ads How it works To understand how this differs from Google Ads, refer to the blog article: Google Ads ...Introducing BookNow 2.0
Introduction BookNow 2.0 is the next generation direct bookings on your website. It is an Embedded' Booking Engine - enhancing the booking experience and making it easy to customise. No more iFrames, sub-domains or breaking away to another domain, ...How do I update the Terms and Conditions on BookNow?
On your Booknow Page there are Terms and Conditions which a guest will accept in order to complete the booking process. To update these Terms and Conditions, log onto your BookNow Content manager, the below steps need to be followed: Select the Site ...How do I change/add Images on BookNow?
In order to change or add new Images on BookNow the below steps need to be followed: 1. Image Carousel An array of Property Images can be uploaded here which will display on the Image Carousel on the BookNow Homepage. The user will have the ability ...How do I hide a room on BookNow?
BookNow utilizes Room Categories. When adding rooms on NebulaCRS a Room Category is assigned, this Room Category is then visible on the Content Manager and BookNow page. If you wish to prevent a Room Category being bookable on BookNow or another a ...