Booking Widget

Online booking any small-business site can add in two lines.

Visitors pick a service, a day and an open time. The owner gets an alert and confirms it from a simple inbox. It runs on Cloudflare Workers with a D1 database, so two people can never take the same slot.

Get the embed code Open the owner inbox
Ridgeline Barber Co. (555) 010-0148

Book a chair

Cuts, fades and beard work, Tuesday to Saturday. A fictional shop, here to show the widget on a real-looking page.

Make it yours

What visitors do
How it shows
Brand colour

Buttons get white text on this colour.

Theme
Paste into any page

Built for the way small businesses take bookings

Most booking tools are a whole platform with a monthly fee. This is one form that fits into the site the business already has.

No double bookings
Every slot a booking covers is a row with a unique key in the database. If two people send the same time at once, one request saves and the other is asked to pick again.
The owner stays in charge
Requests hold the time and wait in an inbox to be confirmed or declined. Alerts go to Telegram, Discord, Slack or email, with the customer's number one tap away.
Any brand colour, still readable
Give it the business's colour and it works out readable button text and darkens links until they pass WCAG contrast. Give it the site's background too, and the text and borders are worked out to match.
Real opening hours
Lunch breaks, closed days, holidays, notice time and services of different lengths. Hours are kept in the business's time zone, and visitors elsewhere are told which one.
Spam stays out, without a puzzle
A hidden honeypot field, a check on how fast the form was filled in, and a limit per visitor per hour. No CAPTCHA for real customers to solve.
Works for every visitor
Real labels, errors beside the field they belong to, a calendar you can drive with arrow keys, 44px tap targets, and no motion for people who turn it off.
Can't break the host site
It lives in a Shadow DOM, so the site's CSS can't reach in and its own can't leak out. One script, about 13 KB compressed, no framework.
Enquiry mode for quote-first trades
Plumbers and builders don't book a slot; they want to hear what the job is. The same widget becomes a short enquiry form, with the reply route the customer picks made required.

Add a business in three steps

Each business is one JSON file with its hours and services. Deploy once, then paste the widget into as many client sites as you like.

  1. Create the business

    This writes its config file and prints the owner's inbox key once.

    npm run new-site -- ridgeline "Ridgeline Barber Co."

  2. Set hours and services

    Edit sites/ridgeline.json: opening hours, services with lengths and prices, notice time and alerts.

    "tue": [["09:00", "19:00"]]

  3. Deploy and paste

    Deploy the Worker, then add the two lines to the business's site.

    npm run deploy

Want online booking on your business's website?

I'm Ernest, a web designer who builds sites for small businesses. I can set this up on your site, in your colours, with alerts going to your phone.

Work with me See the code