servicebooked.ca/f/your-form) and an embed snippet you can paste on your own site.
The real magic: every submission lands in your CRM as a contact, and (if you’ve enabled it) the AI Receptionist auto-replies to the lead within seconds.
Build a form
1
Click 'New form'
From Dashboard → Forms, click the New form button.
2
Name and describe it
The form name is internal. Give it something obvious like “Quote request” or “Service area check.” The description is shown to visitors above the form.
3
Add fields
Click Add field and pick from:
- Short text — for names, single-line answers
- Long text — for descriptions, “tell us about your job”
- Email — validated automatically
- Phone — tidied into
(555) 123-4567when the visitor moves on - Number — for sizes, quantities
- Date — a native date picker
- Dropdown, Radio buttons, Checkboxes (multi) — pick lists
- Checkbox (single) — one on/off box, e.g. a consent agreement
- File upload — let visitors attach photos or PDFs
- Address (group) — one field that adds street, city, province, and postal code together and auto-fills the contact’s address
- Section heading and Paragraph text — static content to break a longer form into readable sections (they collect no answer)
first_name, last_name, email, phone, address) automatically populate the contact in your CRM. Other fields are saved as part of the submission. The Address (group) field handles the address ones for you.Use the duplicate icon on any field to copy it — handy when you need several similar fields.4
Arrange the layout
Turn on Half width on two fields in a row and they sit side by side on desktop (Phone and Email, First and Last name) — everything stacks to full width on mobile automatically. Use Section heading / Paragraph text fields to group a long form (“Contact details”, “Project details”). On checkbox and radio fields, turn on Show options side by side to flow a long option list into a compact wrapped layout instead of one per line.
5
Add help text and limits (optional)
Each field can carry help text shown underneath it (“Include your unit number”).You can also constrain answers:
- Short/Long text — minimum and maximum character counts.
- Number — minimum and maximum value.
- Date — an Earliest and Latest bound. Choose Today for a rolling rule (“no past dates” for a booking form) so it never goes stale, or pick a specific date for a fixed window.
6
Mark required fields
Toggle the Required flag on any field that must be filled. Visitors get an inline error under the exact field if they try to submit without it — and the form jumps them to the first problem.
7
Capture consent (SMS / marketing)
Add a Checkbox (single) field for your consent language, then turn on Consent to contact. When a visitor checks it, ServiceBooked stamps a consent timestamp on their contact record — not just buried in the submission — so you have proof of express consent for CASL / A2P. (A later STOP still opts them out; the two are independent.)
8
Show a field only when it's relevant (optional)
Any field can be conditional. Under a field, set Show only if to an earlier dropdown / radio / checkbox field and pick a value — the field then appears only when the visitor chooses that value. The classic use: an “Other — please describe” text box that shows up only when they pick “Other”.Hidden fields are never required and never saved, even if they were filled in before the visitor changed their answer.
9
Choose a label style (optional)
By default each field shows a label above the box. For a compact, marketing-style look, turn on Hide field labels (placeholder-only) in Settings — each field then shows its label as greyed placeholder text inside the box (set a placeholder per field, or the field’s label is used). Labels stay readable by screen readers, but a visible label is easier for everyone since the placeholder disappears once someone starts typing.Some fields can’t be described by a placeholder — a date picker ignores placeholders entirely, and a radio or checkbox group’s question is its label. For those, tick Always show label on that field (the option appears on each field once placeholder-only mode is on) to keep just that one labelled.
10
Customize the submit button and footer
Set the button text (“Get a Quote” beats “Submit”) in Settings → Content and its color in Settings → Appearance. Optionally add a trust line (Settings → Content): a short reassurance shown with a shield icon below the button, like “Trusted by homeowners across the city.”
11
Set the success state
After a successful submission, visitors see either:
- A success message you write (default), or
- A redirect to a custom URL (a thank-you page on your site, for example)
12
Publish
Toggle the Published switch at the top. Until published, the form’s public URL returns 404 — so you can iterate without exposing a half-done form.
Language
The public form follows your account’s communication language (Settings → Automations). Set it to French and the form’s buttons, prompts, and all the validation messages (“this field is required”, “please enter a valid email”) show in French. English and Bilingual accounts get an English form. Your own field labels and placeholders show exactly as you type them — so on a French form, write your labels in French too.Embed on your site
Once published, three options to get the form in front of visitors:1. Hosted public link
Every form has a public URL likeservicebooked.ca/f/abc123. Share it directly — paste in an Instagram bio, link from a Google Ad, embed in an email. No installation needed.
2. iframe embed
For embedding on your website, copy the iframe snippet from the Share tab and paste it on any page. It includes a small<script> that auto-sizes the form to its content — see Embed on your site for the full snippet and per-platform steps.
Sizing: the height adjusts to the form’s content automatically. The width fills whatever container you drop the iframe into (the form card itself is capped at a readable width and centred). To tighten or loosen the gap between the card and the edge of the iframe, use Space around the form (Settings → Appearance): None sits the card flush to the edge, Standard is the default, Large gives a drop shadow room.
Putting the form on a photo or gradient? Turn on Transparent background (Settings → Appearance) and the embed drops its background colour, so the form card sits directly on your page’s hero image instead of inside a solid box. The card itself stays solid so the fields stay readable. You can also override it per page with ?bg=transparent (or ?bg=solid) on the iframe URL.
3. Native embed (advanced)
The form’s public JSON is also available at/api/public/forms/abc123 — for custom integrations where you’d render the fields yourself. Most owners don’t need this.
Auto-tagging and pipeline integration
When a form submission creates a new contact, you can:- Auto-apply tags — e.g., every “Quote request” submission gets the
quote-requesttag - Set a starting pipeline stage — e.g., new leads automatically land in your “Lead” stage
- Auto-open a deal — create a pipeline card for follow-up
What happens to a submission
- Validates against your form schema.
- Creates / updates the contact in your CRM (deduped on email + phone).
- Saves the full submission to Form submissions (visible from the form detail page).
- Tags the contact, sets pipeline stage, opens deal — whatever you configured.
- Fires the auto-reply (if enabled) — see auto-reply.
- Sends notification emails to your team — see Notifications.
- Lands in Inbox as a new conversation.
Reviewing submissions
The Submissions tab on the form detail page lists everyone who’s filled out the form, newest first. Each row is collapsed to a one-line summary — click it to expand every answer they gave.- Search — the box at the top matches what people actually typed (a name, an email, a phrase from their message), not the field names.
- Export CSV — downloads every submission for that form as a spreadsheet, including answers to fields you’ve since renamed or removed, so nothing is lost. Opens cleanly in Excel and Google Sheets.
Service-area check
If you only serve certain areas, turn on Check service area by postal code (Settings → Service area) and list the postal codes you cover. A submission whose postal code doesn’t match is stopped — the visitor sees an out-of-area message and can’t submit, and it never reaches your CRM.- Make sure the form collects a postal code — either an Address (group) field or a Short text field keyed
postal_code. The check reads that value. - List full codes or just the start: a submission’s postal code must begin with one of your entries. Works for Canadian FSAs (
K1A,K2P) or US ZIP prefixes (902). Case and spaces don’t matter. - Optionally set a custom out-of-area message (“We only serve the Ottawa area”).
Views and conversion
Each form on the Forms list shows how many times its public page has been viewed alongside submissions, plus a conversion rate (submissions ÷ views). Use it to spot a form that gets traffic but few completions — usually a sign it’s too long or asking for too much. Views count from the hosted link and iframe embeds; submissions posted directly to the API may push conversion toward 100%.Honeypot and spam
Every form has a hidden honeypot field that catches most bot submissions automatically. Plus we rate-limit per (IP, form) so a flood of submissions from one source gets blocked. For a public form that’s attracting real spam, turn on Spam protection (Settings) to add an invisible Cloudflare Turnstile check. Most visitors never see anything; suspicious ones get a quick one-click challenge. It’s the modern, no-annoying-CAPTCHA answer — recommended for forms you share widely.Next
Embed on your site
Detailed embed options for various platforms.
auto-reply
Have the AI Receptionist reply intelligently to every submission.