Passing URL Parameters in Trafft Booking

Trafft allows you to pass customer data and custom field values directly through booking URLs or
embedded booking widgets. This lets you prefill booking forms, reduce manual input, and create smoother
booking experiences.
This page explains how URL parameters work, why to use them, and common real life use cases.

What are URL parameters

URL parameters are key value pairs added to the booking URL. When a customer opens the booking page,
Trafft automatically reads these parameters and prefills the matching fields in the booking form.
They work for:

• Direct booking links
• Event or service specific booking pages
• Embedded booking widgets

Supported parameters

Customer data

You can prefill standard customer fields using the following parameters:
• customerFirstName
• customerLastName
• customerEmail
• customerPhone
The phone number should be passed in international format with country code.
Example:
https://yourcompany.trafft.com/booking?customerFirstName=John&customerLastName=Doe&customerEmail=johndoe@gmail.com&customerPhone=+1212555

Custom fields

Custom fields can also be prefilled.
To do this, you need to pass a JSON object where:

• The key is the custom field ID
• The value is the value you want to prefill

The parameter name is customFields.
Example:
https://yourcompany.trafft.com/booking?customerEmail=johndoe@gmail.com&customerFirstName=John&customerLastName=Doe&customFields={"3":"111"}

Multiple custom fields:
https://yourcompany.trafft.com/booking?customerEmail=johndoe@gmail.com&customerFirstName=John&customFields={"1":"Test+Value","2":"Another"}

Spaces in values should be URL encoded, for example using "+"

Service or employee specific booking pages

You can pass parameters on service or employee booking pages as well.

Example:

https://yourcompany.trafft.com/booking/e/john-doe?t=s&uuid=5d19bf1e-81dd-43b3-8fab-5203b64e7a8a&customerFirstName=Johanna&customerLastName=Miller&customerEmail=johanna.miller@gmail.com&customerPhone=+14155550198&customFields={"12":"Yes","11":"24"}

All supported parameters behave the same way regardless of the booking page type.

Using URL parameters with embedded booking

URL parameters can also be passed when using the embedded booking widget. In this case, parameters are defined as data- attributes on the main embed container.

This approach is especially useful when you already have customer data available on your website and want to prefill the booking form automatically.

URL parameters can also be passed when using the embedded booking widget. In this case, parameters are defined as data- attributes.

Basic examples:

<div class="embedded-booking"
data-url="https://yourcompany.trafft.com"
data-query="&t=s&uuid=303bad05-6504-417b-b0fc-a2635ec46c9a"
2data-employee="john-doe"
data-lang="en"
data-customer-email="johanna.miller@example.com"
data-customer-first-name="Johanna"
data-customer-last-name="Miller"
data-customer-phone="+14155550198"
data-custom-fields='{"12": "Yes", "11": "24", "100": "CUST-9001"}'
style="min-width: 320px; height: 768px;">
</div>
<script type="text/javascript" src="https://yourcompany.trafft.com/
embed.js" async></script>

Embedded booking with custom fields

Custom fields can be passed using the `data-custom-fields` attribute. The value
must be a valid JSON string where:
- Each key represents a Custom Field ID from your Trafft account
- Each value represents the data you want to prefill

<div class="embedded-booking" data-url="https://yourcompany.trafft.com" data-
query="&t=s&uuid=303bad05-6504-417b-b0fc-a2635ec46c9a" data-employee="john-doe" data-lang="en"
data-customer-email="johanna.miller@example.com" data-customer-first-name="Johanna" data-customer-
last-name="Miller" data-customer-phone="+14155550198" data-custom-fields='{"12": "Yes", "11": "24"}'
style="min-width: 320px; height: 768px;"> </div> <script type="text/javascript" src="https://
yourcompany.trafft.com/embed.js" async></script>

This works for visible and hidden custom fields alike.

Passing internal or hidden data (Customer ID)

A common advanced use case is passing internal identifiers such as a Customer ID
that should not be visible to the customer during booking.

To achieve this:
1. Create a Custom Field in Trafft (for example named "Customer ID")
2. Note the Custom Field ID
3. Hide the field from the booking form using Custom CSS
4. Pass the value through URL parameters or embedded booking using

Examples:
data-custom-fields='{"100": "CUST-9001"}' ```
`customFields`

The value will be stored with the booking and can be used for internal tracking, CRM matching, or
integrations.

Advantages

Using URL parameters allows you to:

• Prefill booking forms automatically
• Reduce friction during booking
• Avoid duplicate data entry
• Integrate Trafft with external systems
• Create personalized booking links

Common use cases

• Sending personalized booking links via email or SMS
• Redirecting users from landing pages with known customer data
• CRM or marketing automation integrations
• Membership portals or client dashboards
• Event registration flows

Important notes

• Parameters must be URL encoded
• Custom field IDs must match the IDs in your Trafft account
• If a field is already filled by the user, Trafft will not overwrite it
• Invalid or unknown parameters are ignored automatically