Putting booking on your own website

There are three ways to get a customer to your booking flow, and they all lead to the same thing.

The hosted page

bookodile.com/book/your-shop. Nothing to install, works on any phone, and it is the link to put in an Instagram bio, a Google Business profile, or a text message.

If you have no website at all, this is your website. It carries your name, your logo, your brand colour, your services and your opening hours.

The embedded widget

The same booking flow in an iframe on your own site. Copy the snippet from settings, paste it into your page, and customers book without leaving you.

One deliberate difference from the hosted page: the embed is always light.

The hosted page follows the visitor's device — dark phone, dark booking page. The embed does not, and that is on purpose. An iframe follows the visitor's operating system rather than the page it is sitting in, so a shop with a white website would get a black rectangle punched into it for every visitor with dark mode on, with no way to fix it. The embed stays light so it matches your site.

Everything else about the two is identical — same services, same availability, same rules, same confirmation.

The QR code

Generated for you, and it points at your booking page. It goes on a mirror, a window, a receipt, a business card, the back of a chair.

The reason it works is timing: a customer who has just been served is the most likely person in the world to book again, and they are holding their phone.

What the customer needs

Nothing. No account, no app, no password. That is true on all three routes.

Branding

Your logo, brand colour and a banner strip are shared across all three. The brand colour is checked for contrast, and on the dark version of the hosted page a very dark brand colour is lightened enough to stay readable rather than disappearing.

You can upload a separate logo for dark backgrounds if your usual one is dark ink on transparent.

Worked example

A physiotherapy practice with a one-page website.

They embed the widget under "Book an appointment", so patients never leave the site. The same booking page URL goes in their Google Business profile, where most new patients actually find them. A QR code sits on the reception desk for rebooking on the way out.

Three routes, one calendar, one set of availability rules.

Limits

• The embed is always light, whatever the visitor's device is set to.
• The widget cannot be restyled beyond your brand settings. No custom CSS.
• One booking page per branch. A second location has its own URL, its own services and its own hours.
• The QR code points at the booking page, not at a specific service.