Skip to main content

How to enable Mixpanel analytics on your booking tools

Learn how to turn on Mixpanel analytics on your booking widget using the enableAnalytics and enablePerformance configuration properties.

Analytics is off by default

We use Mixpanel to help track how your customers move through the booking journey on your site - for example, how many people open the booking widget versus how many go on to complete a booking. This kind of data is valuable for understanding conversion, but it counts as analytical/tracking data under GDPR.

Because collecting this data requires the end user's consent, we don't switch it on for you automatically. Instead, it's opt-in: you turn it on for your own site only once you've got a valid consent mechanism in place (e.g. a cookie/consent banner that gates when the widget loads with analytics enabled).

If you haven't got a consent process in place yet, please don't enable analytics - doing so without valid consent would put you, not us, at risk of a GDPR breach.

Two ways to enable it, depending on your integration

How you enable analytics depends on how your site links through to the booking flow. There are two valid methods:

  1. URL parameter - if your site links directly out to a hosted booking page URL.

  2. SDK-rendered widget - if your site uses the booking tools SDK to render the booking flow directly on the page, either as a fully embedded iframe or via the "Book Now" popover button, rather than linking to a separate URL.

Check which applies to you by looking at how your booking flow is triggered on your site - a link out to a separate booking page, or a booking flow rendered directly on the page (as an embedded iframe or a popover).

Method 1: URL parameter

If you link directly to a hosted booking page, analytics can be turned on by adding a query parameter to the end of that URL:

  • enableAnalytics

Method 2: SDK-rendered widget (embed or popover)

If you use a fully embedded iframe or the "Book Now" popover button, there's no separate URL to add a parameter to. Instead, analytics is controlled by two properties:

  • enableAnalytics

  • enablePerformance

How you set them depends on whether your widget is embedded or in popover mode - the syntax is different for each.

Embed mode

If you're rendering the widget with Appointedd.renderWidget(...), set the two properties in the configuration object passed to that call, alongside any other config (such as widgetId):

<script src="https://booking-tools-sdk.appointedd.com/appointedd-booking-tools-sdk-v1.js"></script>
<div id="iFrameContainer"></div>
<script language="javascript" type="text/javascript">
Appointedd.renderWidget("iFrameContainer", {
widgetId: "123456789",
enableAnalytics: true,
enablePerformance: true,
});
</script>

Popover mode ("Book Now" button)

If you're using the popover snippet - a <button> with the class appointedd-booking-widget-popover - add data-enable-analytics and data-enable-performance as attributes directly on that button:

<script src="https://booking-tools-sdk.appointedd.com/appointedd-booking-tools-sdk-v1.js"></script>

<button
id="ap-popbtn-123456789"
class="appointedd-booking-widget-popover"
data-widget-id="123456789"
data-enable-analytics="true"
data-enable-performance="true"
>
Book now
</button>

These should be set as properties in your SDK configuration/initialisation, before the widget's load/render call i.e. wherever you currently configure and render the iframe or "Book Now" button.

Set the values to true only once consent has been obtained, and consider wiring them up dynamically to your consent banner's state (e.g. enableAnalytics: userHasConsented for embed mode, or updating the button's data-enable-analytics attribute once consent is given for popover mode) rather than hard-coding true.

Quick reference: which method applies to you?

Your integration

Where analytics is controlled

Direct link to a hosted Appointedd booking page/URL

Query parameter on that URL (enableAnalytics)

Fully embedded iframe on your page (SDK-rendered)

enableAnalytics / enablePerformance properties in the Appointedd.renderWidget() configuration object

Popover "Book Now" button (SDK-rendered)

data-enable-analytics / data-enable-performance attributes on the popover button

Getting your metrics

The data collected feeds into Appointedd's Mixpanel account, not directly into a dashboard on your end. To access these metrics once analytics is enabled, please liaise with your Client Success Manager, who can share the relevant conversion data with you.


Need help?

If you're still unsure, please get in touch via our support chat and we'll do our best to assist.

Did this answer your question?