Add Boulevard self-booking to your website
Boulevard does not give you a booking page to link to. It gives you an overlay that opens on top of whatever page the client is already reading, which changes where the code goes and how the button has to be built.
Quick answer
In Boulevard, go to Manage Business, then Client Experience, then Self-booking, and copy the HTML snippet generated for your business. Paste it into the head of your site so it loads on every page. Then create a button and set its link target to #book-now, with open-in-a-new-tab switched off. Clicking that button calls the overlay on top of the current page. The snippet and the button are two halves of one mechanism. A button with no snippet loaded does nothing at all, which is how this usually goes wrong.
Overlay or a hosted booking page
| Self-booking overlay | Link to Boulevard's hosted page | |
|---|---|---|
| Client leaves your site | No | Yes |
| Needs the snippet installed | Yes, on every page | No |
| Works from any button anywhere | Yes | Yes |
| Keeps your own branding around it | Yes | Partly |
| Set up in | Ten minutes | One minute |
Step-by-step
- 1
Copy the snippet Boulevard generated for you
Manage Business, then Client Experience, then Self-booking. The HTML there is unique to your business and already exists — you are not generating anything new, just finding it. If your account was set up by Boulevard's onboarding team the snippet may already have been sent to you by email, in which case check both and use the one in the dashboard.
- 2
Load it in the head, on every page
Paste the snippet between the head tags of your site rather than into the body of one page. The overlay has to be available wherever a booking button appears, and on most small business sites that means the header, the services page and the footer at minimum. Putting it on a single page is the usual cause of a button that works in one place and silently fails everywhere else.
- 3
Point the button at #book-now
Create your button as normal, then set its link target to #book-now — an anchor, not a URL. This is what the snippet listens for. Getting a real URL in there instead sends the client to a page that does not exist.
- 4
Turn off open in a new tab
The overlay opens over the current page, so a new tab has nothing to open into and the click appears to do nothing. Every button builder defaults this differently, so check it on each button you make.
- 5
Test it on a phone before you announce it
Overlays are where mobile layouts break: a fixed header can sit on top of the close button, leaving clients trapped in a panel they cannot dismiss. Open your own site on a real phone, book a test appointment through it, and cancel it in Boulevard afterwards.
Tips & best practices
- Put a booking button in the header and at the end of your services page. Those two placements account for most bookings on a salon site, and the overlay costs nothing to trigger twice.
- If the button does nothing, check the snippet is on that specific page before you touch anything else. That is the fault nine times out of ten.
- Boulevard is priced for multi-chair salons and medspas, not a single stylist. If you are on your own and paying for it anyway, the overlay is the part you are getting your money's worth from, so make it prominent.
Common questions
Why does my booking button do nothing when clicked?
+−
Almost always because the snippet is not loaded on that page. The button is only an anchor; the snippet is what listens for it. Confirm the code is in the head of that page, then check the link target really is #book-now and not a URL.
Do I need a separate booking page?
+−
No. That's rather the point of the overlay. Clients book from whatever page they are already on, which means you can put a button on a specific treatment page and they never lose their place.
Can I still use a plain link to Boulevard instead?
+−
Yes. Boulevard also hosts a booking page you can link to like any other URL, which needs no snippet. You lose the on-site experience but it is a reasonable fallback if you cannot edit the head of your site.
Will the overlay work if my site is one page?
+−
Yes, and it suits single-page sites particularly well, since the snippet only has to load once and every button on the page can trigger it.