Skip to main content

How to customize your widgets

You can customize the look, feel and function of your booking process with CSS & SASS. It is possible to adjust your widget's colours and fonts via CSS/SASS. Custom CSS/SASS is used to overwrite and add CSS selectors and change their properties.

If you want to add a booking engine to your website, learn how to embed an experience booking engine widget.

⚠️ Please note that doing this can break your booking process. We recommend you to test your changes thoroughly.

How can you add CSS to your widgets?

1. Navigate to Settings > Booking channels and then click the booking channel's widgets you'd like to edit, from the list.

2. Click Theme under the Widgets section in the left-hand side menu. Make sure the Show advanced options box is checked.

3. Enter your custom CSS/SASS in the box below and click Continue. The changes should automatically be reflected in your widgets.

Need help with the CSS customisation?

Take a look at our Widget customization resources.

Use your browser' inspect element feature to find the class names of the elements you want to overwrite.

⚠️ Do not use the scrambled class names, on the format sc-abCDe cbdEFg as they are automatically generated and will change from time to time.