embed on your website
Embed a sign-up sheet in Webflow
Copy the inline snippet from the sheet's Share tab, paste it into a block on your Webflow page that accepts HTML, and publish. The sheet appears right on your page and takes sign-ups exactly like its public link does.
Copy the snippet from SignUpChurch
Publish the sheet.
An unpublished or archived sheet shows as nothing inside an embed. Publish it from the sheet page first; you can keep editing slots afterwards.
Open the sheet's Share tab.
Find the Embed on your website card. It holds two snippets: Inline embed, which shows the form on your page, and Popup button, a button that opens the form over your page.
Click Copy code under Inline embed.
The button says Copied! when it has. If copying fails, select the code in the box and copy it by hand — all of it, from
<!--to</iframe>.
Paste it into Webflow
Add an Embed element.
In the Designer, open the Add panel (the +), find Embed (under Components, or Code Embed in the newer layout), and drag it to where the sheet should sit. It behaves like any other element, so put it inside the section or container you want.
Paste the snippet.
The code editor opens. Paste the snippet and click Save & Close. Don't add html, head, or body tags around it.
Publish.
Click Publish. The Designer shows a gray placeholder for custom code; the published page shows the sheet.
Check it
Open the published page in a private window — not the builder's editor preview, which often doesn't run embeds. You should see the sheet with its spots. If the space is blank, the sheet is probably unpublished; if you see the code itself as text, it went into a text block instead of an HTML block. The embed shows the same banner and read-only spots as the public page when the sheet's sign-up window is closed. More on publishing, windows, and the snippets in Publish, share & embed.
Common questions
- The embed shows a placeholder in the Designer.
- That's normal. Webflow draws custom code as a gray box in the Designer and only runs it on the published site (and in Preview, when custom code is enabled). Publish and open the live page.
- Is there a size limit on the snippet?
- Webflow caps an Embed element at 10,000 characters. The inline snippet is a few hundred and the popup button under two thousand, so both fit.
- Inline embed or popup button — which should I use?
- Inline shows the whole sheet right on your page, which is best for a page about that event. The popup button is a single button that opens the sheet in a window over your page — good for a page that lists several things. Both take sign-ups exactly the same way. If your website builder strips JavaScript, only the inline embed works; the popup button needs a little script to open the window.
- The form is cut off at the bottom.
- The inline snippet is a frame 620 pixels tall and a long sheet scrolls inside it. To show more at once, change height="620" in the snippet to a larger number, such as 900 or 1200, before you paste it — or after, if your builder lets you edit the code.
- Does the embed follow my design?
- Yes. The colors, fonts, spacing, and logo set on the sheet's Design tab (Basic and Pro) apply inside the frame. The embed shows just the form, without SignUpChurch's site header, so it sits in your page.
- Do sign-ups through the embed work the same?
- Yes. It's the same form: the confirmation email, calendar invite, waitlist, spots-per-person cap, and ChMS sync all work as they do on the public page, and the thank-you appears inside the frame.
- I renamed the sheet's link. Do I need to update the embed?
- No. Renaming the permalink keeps a redirect from the old address, so embeds, printed QR codes, and shared links keep working.
- Will Google find the sheet on my site?
- The embed itself is kept out of search engines on purpose; the sheet's own public page is what search engines index. If you want the sheet found, link to its public address from your page as well as embedding it.
Next up: Publish, share & embed →