Any website · One snippet · 2 minutes
Add online booking to any website
If you can insert HTML into a page, you can take appointments on it. There is no platform requirement, no plugin and no build step — the snippet is plain markup that works on a hand-built site, a static generator, a Rails or Django template, or any CMS with an HTML field.
Step by step
Paste the snippet where the service list belongs
Put your snippet from Booking Page → Add to Website directly into the page markup, at the spot where booking should appear. That is the whole integration — the widget sizes itself to the content and needs no configuration.
The code you paste
Example — replace with your own snippet
<iframe id="booking-frame" loading="lazy" src="https://app.gobookingsuite.com/?key=YOUR_KEY&embed=1"
title="Book an appointment"
style="width:100%;border:0;height:600px"></iframe>This example is an illustration — the key is a placeholder. Your real snippet, with your key, is in the admin under Booking Page → Add to Website. It also carries your salon's phone and email as a fallback and a small script that reports the widget height.
Before you start
A strict Content Security Policy does not break booking
If your site restricts scripts, the small height script may not run. Booking itself is unaffected: the service list renders and scrolls inside the frame, and clients can still pick a service, choose a time and pay. We measured it on a 3352px catalog inside a 600px frame — all of the services stayed reachable.
Allow-listing our domain in your CSP only buys you automatic height matching. It is a polish item, not a requirement.
The result
What your clients end up with
This is the actual widget, embedded here with the same snippet described above. Pick a service and a time — that is the whole flow your visitors get, on your own page.
- The service list renders where you pasted the snippet.
- Clicking a service opens time selection, and the booking goes through end to end.
- The frame grows to fit the list. If it does not, the height script is being blocked — booking still works, the list just scrolls.
- On a static generator, confirm the HTML was not escaped by your template engine — the snippet must reach the browser as markup, not as text.
Live demo — a real widget, book a test appointment
Questions
6 things people ask
Do I need a developer for this?
If you already edit your own HTML, no. It is one paste in one place.
Does it work with React, Vue or a static site generator?
Yes. It is a plain iframe, so it drops into JSX, a template or a Markdown file that allows HTML. There is also a React embed kit if you want tighter control over the surrounding page.
Will it slow my site down?
The widget is lazy-loaded: below the fold, the browser does not fetch it until a visitor scrolls to it. In our measurement that keeps roughly 21 requests and 332 KB off the initial page load.
What happens if the booking service is unreachable?
After 8 seconds without a response, the frame is replaced by your salon's phone number and email so the visitor still has a way to reach you. The fallback clears itself once the service responds again.
Can I put a different service on each page?
Yes. Add a parameter to the embed URL for a single service or one category — the admin generates the exact snippet per page.
Can I restyle the widget to match my site?
Yes — nine named colors, your own fonts, four layouts and two component styles in Theme Studio, plus custom CSS and a theme API included in the plan.
Different site?
Wondering whether this is the right booking tool at all?See what the widget does on your own site →
Get your embed code
in the next five minutes.
Sign up, add your services, copy the snippet from Booking Page → Add to Website.