Designing your booking page
Arrange and style the page your clients book from: how your services are laid out and ordered, what colours they use, how wide the column runs, and what appears in the header. Changes are saved as a draft and reach the public page only when you publish.
Download PDFOverview
Your public booking page is where a prospective client meets your practice, and until now every firm's looked the same. The booking page designer lets you decide how your services are arranged, what colours they carry, how wide the page runs, and what appears above them.
Where to find it. Dashboard, then Bookings, then Booking page design.
Nothing changes until you publish. Everything you do in the designer is saved as a draft. Your live page keeps rendering exactly as it did until you click Publish. That is deliberate: you can experiment freely, leave halfway through, and come back tomorrow without a client ever seeing a half-finished page.
Each consultant designs their own page. A member designs the page clients reach through their own booking link. An Owner can design any member's page. If your firm has one booking page, that is the one you are editing.
If you never open it, nothing changes. A firm that never touches the designer keeps the page it has always had. There is no new default to opt out of.
Starting designs
The quickest way to change how your page looks is to pick a starting design. Each one sets the layout, spacing, and neutral colours together, so you get a page that looks deliberate without adjusting anything by hand.
Classic. The page you have today, exactly. Choosing it is also how you undo an experiment.
Grid. Two columns of cards on a wide screen, with room for service images.
Minimal. Quieter: compact rows, softer borders, a smaller logo, and no progress bar.
Statement. Roomy and high contrast: large cards with images, a large logo, and your firm details shown below the services.
Starting designs are free for every firm, on any plan. They keep your own brand colour: a firm using navy and a firm using maroon both get the same layout in their own colour, not the same page.
Once you adjust anything by hand, the design is described as Custom. Your adjustments are kept; picking a starting design again replaces them.
Arranging your services
Columns. One, two, or three columns on a wide screen. Phones always show a single column, at every setting, so you cannot arrange your way into an unusable page on the device most clients book from.
Order. Drag a service into place, or use the up and down arrows beside it. The arrows do everything dragging does, so the order is reachable from the keyboard alone.
Full width. Any service can be set to span the full width of the grid, which is useful for a flagship consultation you want noticed first. This has no effect in a single-column layout, where every card is already full width.
Card style. Compact keeps text only. With image adds a small thumbnail beside the service. Large image puts a wide banner above the text. The last two only show something if the service actually has an image on it.
How clients pick a service.
Cards. The default. Each service is a card showing its price, duration, and description.
Drop-down list. One compact menu. Worth considering if you offer a long list of services; worse than cards if you offer three.
Both. The menu and the cards together, sharing one selection. A returning client can jump straight to what they want, while a new one still reads the detail on the cards.
Publishing also saves this order back to your services list, so the dashboard and your public page agree about which service comes first.
Colours, and the readability check
Colouring services by type is free for every firm. You can give free consultations, paid consultations, Q&A sessions, and written opinions each their own colour, so a client can tell them apart at a glance. The colour paints the card's border and a soft background tint; it never touches the text, which is why it cannot make anything unreadable.
The first matching rule wins, and a colour you set on an individual service beats any rule.
Page colours are a Premium control. Six colours make up the page: the page background, the card background, the main text, the secondary text, the borders, and your accent colour. Any you leave alone follow your brand theme from Settings, so changing your theme later still repaints your booking page.
The contrast check, and why it can block you. Before your colours reach a client, they are checked against the WCAG AA readability standard. If a text-and-background pair would be too hard to read, Publish is blocked and the warning names the pair. Saving a draft is never blocked, only publishing.
The failing colour swatches are ringed in amber so you can see which control to change, and Fix automatically adjusts the text colours by the smallest amount that passes. Some combinations cannot be rescued by changing text alone: a very light page with a very dark card is the common one. In that case change the page or card colour rather than fighting the text.
Your page and header, and column width
Your logo and tagline. Place the logo in the centre or to the left, at three sizes. The line beneath it reads Book an appointment unless you replace it with your own wording, which is then translated for clients viewing your page in another language.
Your information block. Show your phone number, address, licence details, and biography above or below your services. Empty fields are dropped rather than left blank, so the block only appears if there is something in it.
The progress bar and the events strip can each be turned off if you would rather your page stayed plain.
Column width.
Choose how wide your booking column runs on a wide screen: leave it As it is now, or pick Narrow, Standard, Wide, Full width, or a specific pixel width between 320 and 1600.
Phones are never affected. The width applies to wide screens only, at every setting. You cannot make your page too narrow to use on a phone.
It sets the whole column. The width governs your header and the upcoming-events strip as well as your service cards, so choosing Narrow narrows all of them together.
The preview's tablet view is approximate. A real tablet applies the width; the tablet frame in the preview does not. Trust the desktop preview, and check a real device if the exact width matters to you.
Previewing and publishing
The preview is the real page. The panel on the right renders your actual services through the same components your clients see, so what you are looking at is what will publish. Switch between phone, tablet, and desktop to check each.
The four buttons.
Save draft. Keeps your work without touching the live page. Safe at any time.
Publish. Sends the current draft to your public page. Saves first, so what you see is what goes live.
Revert. Puts the draft back to whatever is currently published. Use it when an experiment went wrong.
Start over. Returns the draft to the Classic design. This does not touch your published page until you publish.
Where your published page appears. Your design applies to your booking page, to the page a specific consultant's link points at, and to a single-service share link. It does not apply when your booking page is embedded in your own website, because your site already supplies its own background and width.
If you publish nothing, nothing happens. An unpublished draft is invisible to the public. There is no address a client could guess that would show them your work in progress.