Public link and QR
Every published form lives at /f/<form-id>. The Share page offers the link, plus a QR code downloadable as PNG or SVG. Handy for printed posters.
Embedding
Copy the embed snippet from the Share page and paste it into any website’s HTML:
- Inline: the form renders directly in the page.
- Popup: a button opens the form in an overlay.
- Full page: the form covers the whole viewport.
The snippet is a <div data-databooq> plus one script tag; it works regardless of where in the page you paste it.
Sizing an embed
An embed form’s Share page has a size panel: Small, Default and Large presets, an advanced slider for an exact scale between 0.75 and 1.25, a compact density that tightens the vertical rhythm without shrinking the text, and a column setting. Scale moves type and spacing together, so the form keeps its proportions at either extreme.
Fields placed side by side stack into one column below 620px of embed width. Changing the size never moves that point, so resizing an embed cannot silently reflow your page. Set Columns to One or Two to override it.
Drag the preview pane to try a width before you publish; the marker shows where the columns switch, and the readout below it is the form’s real rendered height at that width.
Making an embed match your site
An <iframe> is a style boundary, which is what keeps your page and the form from breaking each other. It also means your site’s CSS cannot reach inside one, so anything the form needs to match has to be a setting rather than a stylesheet rule. Four of them cover most of the gap:
- Transparent background. The form stops painting its own surface and your card shows through, so the two backgrounds cannot disagree. Set it in the embed panel or add
&bg=transparent. - No padding. Removes the embed’s own gutter for a card that already has its own, instead of the two stacking.
&padding=0, or any value up to 64. - No frame. The script embed draws a light border and rounded corners around the iframe by default;
data-chrome="none"on the<div>drops both. - Hide the databooq wordmark from the embed panel. The privacy link next to it stays, since that is a notice rather than branding.
Removing the padding also moves the point where two-across rows stack, because the fields genuinely have more room: with no gutter they sit side by side from 588px rather than 620px. The embed panel shows the real number for your settings.
Height, and why the snippet has two lines
The embed snippet pairs an <iframe> with a small <script src="/embed.js">. The script listens for the height the embedded form reports and resizes the frame to fit, so the form never gets an inner scrollbar and never leaves dead space under itself, at any width.
The script is optional. Drop it, or let a strict content security policy block it, and the iframe still renders the form at the height baked into the snippet, which is the height the Share page measured. Sizing settings you have saved on the form apply to a bare /f/<form-id>?embed=1 too, so the snippet only carries the ones that differ.
Invites
Send personal links to specific email addresses. Each invitee gets a unique tokened link, you see exactly who responded, and you can revoke an invite at any time.
Webhooks
The Connect card on the Share page sends every completed response to a URL of your choice. Paste a Zapier, Make or n8n Catch Hook / Webhook trigger URL to reach Slack, Sheets and thousands of other tools. Each delivery is a JSON POST with event (response.created or response.updated), the form id and title, the response id, submittedAt, the respondent’s email when known, answers keyed by question label with human-readable values, and a raw object keyed by question id for machine consumers.
Deliveries are signed: the X-Databooq-Signature header carries sha256=<hex>, an HMAC-SHA256 of the raw request body keyed with the secret shown next to the URL. Use the Send test button to fire a sample webhook.test delivery and confirm your endpoint hears us before real responses arrive.
Access controls
The Settings tab lets you require an email before the form opens (with your own gate wording and placeholder), prevent duplicate submissions (by cookie or email), schedule open/close times, cap total responses, and auto-close when every grid seat is taken. A Email respondents a copy of their answers switch adds an email question set to send each respondent their submission.
Respondents receive at most one email per submission: when a booking confirmation (with its calendar .ics) and an answers copy would both apply, they are merged into a single message.
Google Sheets
To send responses straight into a spreadsheet instead of an endpoint, connect a Google Sheet from the Responses tab. See Responses and exports.