Bookeo UTM Tracking Integration

Track UTM parameters and marketing attribution in Bookeo bookings with HandL UTM Grabber. Pass flattened source data into Bookeo or send full attribution to Zapier, Make, and other webhooks via a custom confirmation page.

Track UTMs in Bookeo via Flattened Source Parameter

UTM attribution overview

This guide explains how to pass HandL UTM Grabber attribution into Bookeo bookings using the ?source= parameter. UTM Grabber already captures and stores UTM source, medium, campaign, term, content, click IDs, referrer, and landing page data in the visitor's browser. Bookeo only exposes one custom tracking field , Source , so we flatten every utm_ parameter into a single pipe-delimited value and append it dynamically to your Bookeo booking links and widget.

Bookeo documents this approach in their help center: Can I track the source of bookings in Bookeo?

How Bookeo source tracking works

Append ?source= followed by your campaign identifier to any Bookeo booking link or gift voucher link. For example:

The same parameter works when embedding the Bookeo widget on your WordPress site. After a booking is completed, the source value appears in:

Flatten UTM Grabber data into the source field

Because Bookeo only provides the single source custom field, concatenate all UTM Grabber parameters into one value using a pipe (|) delimiter:

?source=utm_campaign=summer_sale|utm_source=google|utm_medium=cpc|utm_content=ad1|gclid=abc123

HandL UTM Grabber stores these values in cookies and exposes them via the global handl_utm object (and Cookies.get()). Use the script below to read every tracked parameter and build the source value automatically.

Dynamic source builder script

Add this script on any page that links to Bookeo or embeds the Bookeo widget. It builds the flattened source string and rewrites booking links on page load.

<script>
(function () {
    function buildBookeoSource() {
        var params = (typeof handl_utm !== 'undefined') ? handl_utm : {};
        var parts = [];

        Object.keys(params).forEach(function (key) {
            var value = params[key];
            if (value && value !== '') {
                parts.push(key + '=' + value);
            }
        });

        return parts.join('|');
    }

    function appendSourceToUrl(url, source) {
        if (!source) return url;
        var separator = url.indexOf('?') === -1 ? '?' : '&';
        return url + separator + 'source=' + encodeURIComponent(source);
    }

    var source = buildBookeoSource();

    // Rewrite direct Bookeo links
    document.querySelectorAll('a[href*="bookeo.com"]').forEach(function (link) {
        link.href = appendSourceToUrl(link.href, source);
    });

    // If using the Bookeo widget, pass source when initializing
    // Example: add ?source=... to the widget URL or booking page iframe src
    window.bookeoUtmSource = source;
})();
</script>

Widget / iframe example

When embedding Bookeo, append the flattened source to the widget URL:

<script>
var bookeoSource = (typeof handl_utm !== 'undefined')
    ? Object.keys(handl_utm)
        .filter(function (k) { return handl_utm[k]; })
        .map(function (k) { return k + '=' + handl_utm[k]; })
        .join('|')
    : '';

// Append to your Bookeo widget embed URL
var widgetUrl = 'https://bookeo.com/yourbusiness';
if (bookeoSource) {
    widgetUrl += '?source=' + encodeURIComponent(bookeoSource);
}
</script>

See the full list of trackable parameters in Native WP Shortcodes.

Important limitations

One custom field only. Bookeo provides a single source field for custom tracking. There is no separate field for utm_medium, utm_campaign, gclid, etc. You must concatenate every parameter into this one value.

64-character limit. Per Bookeo documentation, the source value may only contain numbers, letters, underscores (_), hyphens (-), and pipe characters, and is limited to 64 characters. A full set of UTM parameters will almost always exceed this limit.

Practical workarounds within 64 chars:

If you need all UTM parameters without truncation, use Method 2: Webhook on custom thank-you page instead.

Verify tracking in Bookeo

After a test booking, open the booking details and confirm the flattened source string appears in the Source field. You can also export bookings from Marketing > Reports > Bookings and review the Source column.

Track UTMs in Bookeo via Webhook on Thank-You Page

UTM attribution overview

This guide explains how to send full HandL UTM Grabber attribution from Bookeo bookings to Zapier, Make (Integromat), or any webhook , without the 64-character source field limitation. Bookeo redirects customers to a custom confirmation page after booking, where you pass the customer email and trigger a webhook with every UTM parameter UTM Grabber has stored.

If you only need basic source tracking and can fit your data within 64 characters, see Method 1: Flattened source parameter.

Step 1 , Configure Bookeo to redirect to your thank-you page

Bookeo lets you redirect customers to a custom confirmation page after they complete a booking. Follow Bookeo's guide:

How can I redirect customers to a different confirmation page after they have completed a booking?

  1. Go to Marketing > Conversion tracking and analytics
  2. Scroll to Other tracking methods
  3. Paste the redirect code below into the text box

Use a 5-second delay so Bookeo's built-in conversion tracking (Google Analytics, Google Ads, Facebook Pixel, etc.) has time to fire before the redirect:

<script>
window.setTimeout(function() {
    window.top.location = "https://www.yoursite.com/bookeo-thank-you?email={EMAIL}";
}, 5000);
</script>

Notes from Bookeo:

Step 2 , Trigger your webhook on the thank-you page

On your WordPress thank-you page, add a script that merges the email from the URL with all UTM Grabber cookie data and sends everything to your webhook.

Don't forget to replace the webhook URL with your own Zapier, Make, or custom endpoint.

<script>
var qvars = {};
window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m, key, value) {
    qvars[key] = decodeURIComponent(value.replace(/\+/g, ' '));
});

// Merge URL params (email from Bookeo) with all UTM Grabber data
qvars = Object.assign({}, (typeof handl_utm !== 'undefined' ? handl_utm : {}), qvars);

setTimeout(function() {
    var data = new URLSearchParams(qvars).toString();
    console.log('Sending to webhook:', data);

    var xmlHttp = new XMLHttpRequest();
    xmlHttp.open('GET', 'https://hooks.zapier.com/hooks/catch/YOUR_ID/YOUR_KEY/?' + data, true);
    xmlHttp.send(null);
}, 1000);
</script>

This is the same pattern used in our general Zapier thank-you page guide: Triggering Zapier on Thank you Page.

What data gets sent to the webhook

The webhook receives a query string containing:

See the complete parameter list in Native WP Shortcodes.

Zapier / Make setup

  1. Create a new Zap (or Make scenario) triggered by Webhooks by Zapier → Catch Hook (or Make's Custom Webhook module)
  2. Copy the webhook URL into the script above
  3. Complete a test booking in Bookeo and confirm the webhook receives email plus all UTM fields
  4. Map the fields to your CRM, spreadsheet, or reporting tool

Why use this method?