# A booking page, with nothing to build

> A page hosted here where customers book: its address, its link, the tag that puts it inside your website, trying it in test mode, and what it keeps to itself.

A booking page is a page hosted here where your customers book: a service,
who does it, a free time on your business's clock and their details, with a
deposit or the full price paid online when the service asks for one. Nobody has
to build anything. Switch it on from the **Booking page** screen under Bookings,
and put it in front of customers in any of the ways below.

## Its address

`https://backendfree.com/book/your-address`, where the last part is yours to
pick: lowercase letters, numbers and hyphens, from
3 to 60 characters, not used by another
website here, and not one of the few words kept for this platform. The screen
suggests one from the website's name.

Changing it stops every link already shared from working, at once. The old
address is kept from every other website for
30 days, so nobody else takes over a link you printed.

## A link

Anywhere a link goes: a button on your website, a social profile, a business
listing, an email signature. It works whatever your website is built with, and
without a website at all.

## Inside a page of your website

Paste the tag from the Booking page screen where the booking page should
appear, in an HTML or embed block:

```html title=booking.html
<script defer src="https://backendfree.com/static/bookings/page.js"
  data-page="your-address" data-title="Book at Your Business"></script>
```

It puts the booking page in a frame right after the tag. The frame grows and
shrinks with each step instead of scrolling inside itself, and when a new step
starts with the top of the frame out of view, your page scrolls back to it.
`data-title` names the frame for screen readers. A tag naming an address of any
other shape places nothing.

Where a website runs no scripts, a frame of a fixed height does the same job,
scrolling inside itself when a step is taller:

```html title=booking.html
<iframe src="https://backendfree.com/book/your-address" title="Book at Your Business"
  width="100%" height="900" loading="lazy" referrerpolicy="no-referrer" style="border: 0"></iframe>
```

If your website sends a Content-Security-Policy, it has to allow `https://backendfree.com`
in `script-src` for the tag, and in `frame-src` for either.

## What a customer sees

1. **A service**, with its price and how long it takes, unless you hide either.
2. **Who**, when more than one person does that service: somebody by name, or
   whoever is free. Turned off, this step is skipped and whoever is free is
   booked.
3. **A day and a time**, a week at a time and never further ahead than you take
   bookings, on your business's clock, with a note when the customer's own
   clock is a different one.
4. **Their details**: a name, an email address, a phone number (required when
   your booking rules ask for one), and anything they want you to know.
5. **The answer**: booked, waiting for you to confirm it, or waiting for
   payment.

When something is owed, **Pay** opens the payment page in a tab of its own,
since a payment page is never shown inside a frame. The time is held while they
pay, 15 minutes unless you change it, and the booking page updates by
itself once the payment arrives.

The confirmation email links to a page where the customer sees, moves or
cancels that one booking within your rules, unless **Where customers manage
their booking** on the Booking rules screen names a page of your own.

## How it looks

**Customize** on the Booking page screen opens an editor beside the page
itself: every colour, the ticket summing up the appointment apart from the
rest, the top of the page, the welcome and the note shown after booking, which
steps are asked, the clock, and the layout, spacing, corners and lettering. The page changes as you edit, in test mode; customers see the
changes once you publish them. The lettering is a font already on each
visitor's device, so the page loads nothing more for it.

## Trying it first

The Booking page screen shows the page in test mode, and its **Open in a new
tab** link works for 24 hours, while the page is still switched off
too. Bookings made there are test bookings: they hold no real appointment, and
their emails come to you, marked as a test.

## What it keeps to itself

- It sets no cookie, stores nothing on a visitor's device, and is not measured.
- Search engines are asked not to list it, so it does not compete with your
  website in their results.
- Before a booking is made, Cloudflare Turnstile checks that a person rather
  than a script is booking. Its script reads the visitor's browser to tell
  which, and this platform sends Cloudflare nothing else about them.
- Every call it makes is the API's own, under your rules and limits: free times
  and bookings count against your account's 250,000 requests a month,
  as they would from your own website.

An address nobody holds, a page switched off, and a website whose bookings are
off or whose plan has lapsed all answer *This booking page is not available*.

To build booking into your own pages instead, the
[Quickstart](/docs/quickstart/) takes a booking through the same API.
