Skip to main content
All CollectionsBooking widgetOther
Track online booking usage with Google Analytics 4 (Booking widget v3)
Track online booking usage with Google Analytics 4 (Booking widget v3)
Updated over 2 weeks ago

With Google Analytics 4, you can easily track your clients' actions while booking online using the booking widget, and see how often they completed or abandoned the booking and at which steps.

Requirements

Before using Google Analytics, you will need the following:

  • A valid Google account

  • You must have signed up to Google Analytics

  • A Google Tag ID

If you haven’t created a google account yet, please consult the following page. Once you've created your account, follow these instructions to sign up to Google Analytics, create a Google Analytics 4 property and create a data stream. Finally, follow these instructions to locate your Google Tag ID “G-XXXXXXX”. Make sure to copy your Google Tag ID at the end of the setup process since it will be needed to configure the booking widget.

Using Your Google Tag ID

The code below showcases how to set up the booking widget to send events to Google Analytics. If you are already using Google Analytics on your website, most of the code is likely included.

When including “booknow.js”, remember to select the URL based on your hosting region.

North America

Europe

<head>
<script src="https://www.booxi.com/booknow/booknow.js"></script>
<script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXX"></script>
</head>

<body>
<script type="text/javascript">

// Google Tag Manager boilerplate.
window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
gtag('js', new Date());

// Configure Google Analytics property. Remember to use your own measurement ID
gtag('config', 'G-XXXXXXX');

</script>

// Assign your GA property and open the widget when a button is pressed
<button onclick="BookNow.open({apiKey: 'YOUR_API_KEY_HERE',
googleTag: gtag,
googleTagEventFormat: 'GA4'})">
Book Now</button>;

</body>

What Booxi will send to Google Analytics

Booxi will automatically log the user’s actions as events. Each action of the user in the Book Now widget will generate an event, with 2 additional parameters.

  • Event generated by the user

    • Event Label - containing the value of the selection made by the user

    • Booxi App - value indicating which app generated the event

Note that we (Booxi) don’t send any personal data during this process; user confidentiality is preserved at all times.

Event Definition

Event Name

Event Parameters

Value

Description

Examples

book_now_opened

book_now_event_label

(none)

Book Now has opened.

N/A

booxi_app

“Book Now”

Application used to book

“Book Now”

book_now_select_store

book_now_event_label

Location code or

business name

When location is selected. Label is location code if present, otherwise business name.

"West Valley Spa"

booxi_app

“Book Now”

Application used to book

“Book Now”

book_now_select_category

book_now_event_label

Category name

When a category is selected.

"Beauty Services"

booxi_app

“Book Now”

Application used to book

“Book Now”

book_now_select_service

book_now_event_label

Service name

When service is selected.

"Hair cut"

booxi_app

“Book Now”

Application used to book

“Book Now”

book_now_select_client_availability

Booking_availability_1 to Booking_availability_5

Up to 5 availabilities can be selected while booking, which generates one parameter per selection

Provides the details of the time slots selected - each selection contains a start date/time and end date/time

“2023-05-11T08:00:00.000-04:00 - 2023-05-11T12:00:00.000-04:00”



Booking_availability_count

Number of selected availabilities

Client can select up to 5 client availabilities

1,2,3,4,5

booxi_app

“Book Now”

Application used to book

“Book Now”

book_now_select_client_count

book_now_event_label

Client/participant count

After selecting the number of participants for a group event or for appointment services using per person pricing.

"5"

booxi_app

“Book Now”

Application used to book

“Book Now”

book_now_select_staff

book_now_event_label

Staff name

When staff is selected.

"John Smith"

booxi_app

“Book Now”

Application used to book

“Book Now”

book_now_select_date

book_now_event_label

Date

When a booking date is selected. In (ISO-8601) format.

"2022-09-27"

booxi_app

“Book Now”

Application used to book

“Book Now”

book_now_select_time

book_now_event_label

Start and end date + time

When a time slot or group event is selected. In (ISO-8601) format, local time*

"2024-11-27T09:00:00.000-05:00 - 2024-11-27T10:00:00.000-05:00"

booxi_app

“Book Now”

Application used to book

“Book Now”

book_now_client_info

book_now_event_label

Email / SMS Reminder

When client information is about reminders being requested or not.

“”, or

"Email Reminder”, or

“SMS Reminder", or

"Email Reminder SMS Reminder"

booxi_app

“Book Now”

Application used to book

“Book Now”

book_now_attendee_info

book_now_event_label

Email / SMS Reminder

When client information is about reminders being requested or not.

“”, or

"Email Reminder”, or

“SMS Reminder", or

"Email Reminder SMS Reminder"

booxi_app

“Book Now”

Application used to book

“Book Now”

book_now_survey_completed

book_now_event_label

Client or participant #

Who completed a survey while booking.

“Client”,

“Participant # 1”,

“Participant # 2”...

booxi_app

“Book Now”

Application used to book

“Book Now”

book_now_booking_requested

book_now_event_label

(none)

When "Confirm Booking" is pressed.

N/A

booxi_app

“Book Now”

Application used to book

“Book Now”

book_now_booking_complete

book_now_event_label

(none)

After the booking has been made.

N/A

booxi_app

“Book Now”

Application used to book

“Book Now”

book_now_booking_error

book_now_event_label

Error type

If an error occurs confirming the booking.

“Unknown”,

“OnlineBookingDisabled”,

“BookingHasPassed”,

“BookingIsCompleted”,

“TimeTooEarly”,

“TimeTooLate”,

“ClientBlocked”,

“GroupEventOvercapacity”,

“StaffNotAvailable”,

“NetworkError”,

“BlockedByCaptcha”

booxi_app

“Book Now”

Application used to book

“Book Now”

book_now_abort

book_now_event_label

(none)

If the user closes Book Now without booking.

N/A

booxi_app

“Book Now”

Application used to book

“Book Now”

book_now_move_back

book_now_event_label

Form type

When the user navigates backwards from a form. It provides the name of the screen the user is going back to.

“Service”,

“Category”,

“Client”,
“Participant”,

“Groupevent”...

booxi_app

“Book Now”

“Book Now”

*: The timezone depends on the location of the service (see" Services > "Service details" > Location).

  • If the service location is "At my business" or "At home", the time is based on the store timezone.

  • If the service location is "By videoconference" or "By phone", the time is based on the timezone the user chose at the time of booking.

See here to learn how timezones work in Booxi.

How to access the data reported to Google Analytics

Using the Google Analytics account you created previously, you can go to Reports > Realtime to see the events being logged as bookings are being made. See this Google reference on how to use Real time reports.

Note that events reported by the booking widget are custom events, therefore you will need to create a custom dimension to report on these events, and build more advanced reports. Consult this Google article to learn how to create custom dimensions and build reports.


Troubleshooting - Error Events

Booxi will log a “book_now_booking_error” event along with a descriptive label when encountering errors. Such events will be triggered by one of the below problems:

  • Network error - temporary service interruption

    • At the time of sending a booking request, the server cannot be reached.

    • Labels: NetworkError

  • Server not available

    • The server returns an internal error.

    • Label: Unknown

  • Service set offline when trying to book

    • During the booking process (booking not yet confirmed), a service selected by the client has been turned off by a member of staff in the Back Office and is no longer available online. Upon confirmation, the booking request will be rejected.

    • Label: OnlineBookingDisabled

  • Booking same time slot at the same time - race condition

    • Two clients are booking the same time slot at the same time. The first booking will be successful while the second one will fail.

    • Labels: StaffNotAvailable

  • Booking an appointment too close from current date/time

    • If a booking is initiated before but completed after the starting time of the appointment (booking initiated at 11:58AM for an appointment starting at 12:00PM but completed at 12:01PM), it will result in an error as the booking time is now in the past.

    • Labels: TimeTooEarly, TimeTooLate

Did this answer your question?