Add custom HTML, CSS or JavaScript

Custom code lets you go beyond the built-in design options. Use it to fine-tune styles, add a cookie banner, or load a third-party script on your booking site.

1. 1

   Step 1 of 4

   Open the custom code settings

   Go to Settings › Appearance › Custom. You'll see three cards: Custom HTML, Custom CSS and Custom JS.

2. 2

   Step 2 of 4

   Add your code

   Paste or write your code in the editor of the card you need:

   • Custom HTML is added at the end of every page.
   • Custom CSS is added as a style sheet to every page.
   • Custom JS runs on every page after it loads. Write plain JavaScript without script tags.
3. 3

   Step 3 of 4

   Save

   Click Save at the bottom of the card. Each card saves separately.

   You will see:

   A Settings Updated message appears.

4. 4

   Step 4 of 4

   Test your site

   Open your booking site in a new private window and check that pages look right and that you can still complete a booking.

Where your code runs

Your code runs on every page of your booking site, including the booking flow, client account pages and your custom pages. It also runs inside your booking widget when you embed it on another website.

It doesn't run in the Softalon dashboard.

If you change plans

If your salon moves to a plan without custom code, your code stops running on your site. It stays saved, so it comes back if you return to the Ultimate plan.

var s = document.createElement("script");
s.src = "https://example.com/widget.js";
document.body.appendChild(s);