Before you start
Your form lives in Boilerplate. Set it up once, then copy what you need from the same place. You need to be an Admin.
- Sign in to Boilerplate and open Leads → Settings. Scroll to Web forms. Every workspace starts with one form, Website inquiry.
- Choose the questions under Ask on the hosted form, list your services under Service choices (or leave it empty for free text), and write a Thank-you message. Press Save form.
- Optional: set Thank-you page on your site (it must start with
https://) to send people back to your own page after the form on your site. - Below the form you'll find the two things this guide uses: the Hosted form link and the code under Embed on your website.
Changed the questions or service choices later? Save the form and copy the code again: the code on your site doesn't update by itself. The hosted link always shows the latest version.
Choose how
Most businesses start with a button to the hosted form and add the form to their contact page later. You can use all three at once: every inquiry lands in the same inbox.
| Option | Best for | What you copy | What visitors get |
|---|---|---|---|
| A button or link | Any website, plus your Google Business Profile, Facebook, Instagram and email signature | Hosted form link | Opens a clean form page with your business name. Works everywhere and needs no code. |
| The form on your page | The contact page of a site you edit yourself: WordPress, Squarespace, Wix, Webflow, Shopify, GoDaddy and others | Embed on your website | A plain form that takes on your site's font on most builders. Paste it once. |
| Your own form | Sites with a developer, or a form you already have and want to keep | Your form's address (from the embed code) | Your form sends its fields to us, from the page or with JavaScript. |
Add a button or link
The quickest way in, and it works on every site builder and every social profile. The link opens your form on its own page, made for phones.
- Copy the Hosted form link. It looks like
https://boilerplate.fyi/f/…. - In your site builder, add a button where people look for it: the top menu, your home page and your contact page. Call it what it does, such as Get a quote or Request a callback.
- Set the button to open the link you copied, and publish.
Everywhere else people find you
Google Business Profile
Add a post with a button: open your profile, choose Add post, add a button and paste your form link. If you have a website, keep it as your profile's website: Google's guidelines ask for a link to the business's own site, not a page somewhere else.
Add an action button to your Page, such as Contact us, set it to open a website, and paste your form link. Tap it yourself afterwards to check it opens your form.
In the app, go to Edit profile and add your form as an external link. You can show up to five links on your profile.
Email, quotes and print
Put the link in your email signature and on quotes and invoices, with a line such as "Request a quote". For yard signs, vehicles and flyers, turn the link into a QR code.
Put the form on a page
The code is a plain form with no scripts. It stacks its fields, takes on your site's font on most builders, and sends everything straight to your inbox in Leads.
- Copy the code under Embed on your website.
- Open the page you want it on, usually Contact, and add your builder's code or HTML block. The steps for each builder are below.
- Paste the code exactly as copied. Keep the hidden
company_websitefield: it stops bots. - Publish, open the live page, and send yourself a test (see Test it, below).
After someone presses Send, they see your thank-you message on a Boilerplate page, or your own thank-you page if you set one. Want the button or fields in your colors? Change the inline styles in the code, or ask whoever looks after your site.
Steps for your site builder
Where to paste the code in the most common builders. If yours isn't listed, look for a block called Code, HTML, Embed or Custom code. If your plan doesn't allow code, use a button instead.
WordPress
- Open the page in the block editor and add a Custom HTML block: press + and search for "HTML", or type
/htmlon an empty line. - Paste the code into the block. In newer versions, press Edit HTML first and paste into the window that opens.
- Press Update or Publish, then open the live page.
On your own WordPress, only Administrators and Editors can save form code; for anyone else WordPress strips it out. On WordPress.com, forms need a paid plan with its hosting features activated (WordPress.com activates them when you install your first plugin). On the free plan, use a button to your hosted form instead.
Squarespace
- Edit the page, hover over the section you want, and press Add block. Choose Code.
- Click the pencil icon and paste the code. Leave the mode on HTML and Display Source off.
- Save and publish the page.
Code blocks accept plain HTML on every plan, and the form needs nothing more. Pasted code sometimes doesn't show while you're logged in, so check the page in a private window.
Wix
- In the Wix Editor: Add Elements → Embed Code → Embed HTML. In Wix Studio: Add Elements → Embed & Social → Embed Code.
- Click the new element, press Enter Code, paste the code and press Apply.
- Drag the box until the whole form shows without scrolling, then publish.
Wix shows pasted code in a box of its own, so the form won't use your site's font, and the thank-you message appears inside that box. If that doesn't suit your page, add a button to your hosted form instead.
Webflow
- Open the Add panel and find Custom Code. Drag a Code Embed onto the page.
- Paste the code and press Save & close.
- Publish the site. Some embeds only show on the published site, not in the Designer.
Code Embed needs a paid Site plan or a paid Workspace plan. On a free Starter site, use a button to your hosted form.
Shopify
- Go to Online Store → Themes and press Edit theme. Open the page you want, usually Contact.
- Press Add section, choose Custom Liquid, paste the code and press Save.
- Or, for a page of its own: Online Store → Pages, open the page, press Show HTML (
<>) in the editor, paste the code and save.
Which sections you can add depends on your theme, and the page editor tidies up pasted HTML, so send yourself a test afterwards. The Starter plan can't customize themes: use a link there.
GoDaddy
- In Websites + Marketing, press Edit Website. Hover where you want the form and press Add section.
- Search for "HTML", press Add, and paste the code into Custom Code.
- If the form is cut off, raise Forced Height until it all shows. Preview, then publish.
GoDaddy, like Wix, shows pasted code in a box of its own: no site font, and the thank-you message appears in the box. Sites built with GoDaddy Airo have no HTML section, so use a button to your hosted form.
Square Online
- In your Square dashboard, open Square Online and press Edit site. Open the page you want.
- Press + Add → Section → Embed code, and paste the code in the panel.
- Publish, then test the form on the live site.
Square offers Embed code on its Plus and Premium plans. On the free plan, link to your hosted form instead.
Use your own form
For developers, or if you already have a form you'd rather keep. Point it at your form's address; no key or account is needed, and nothing can be read back.
Your form's address is in the embed code: https://boilerplate.fyi/f/YOUR-FORM-KEY/submit. Send these fields, as a normal form post or as JSON.
| Field | Needed | What goes in it |
|---|---|---|
| name | Required | Their name, up to 120 characters. |
| Required | Where follow-ups go. Must be a valid address. | |
| phone | Optional | Up to 32 characters. |
| service | Message or service required | What they need, up to 120 characters. If your form has service choices, only those count. |
| message | Message or service required | Their own words, up to 4,000 characters. |
| timeline | Optional | asap, within_month, within_quarter, later or unknown. Plain words such as "next month" work too. |
| timeline_text | Optional | When they said, kept as written, up to 120 characters. |
| budget | Optional | One of the budget choices on the hosted form, or text with a number, such as "$8,000". |
| location | Optional | Town or address, up to 120 characters. |
| postal_code | Optional | ZIP or postal code, 3 to 10 letters and digits. |
| company_website | Leave empty | A hidden trap for bots. Anything in it and the inquiry is quietly dropped. |
A normal form post
Use method="post" with the field names above. After sending, the visitor goes to your thank-you page, or to your thank-you message. If something's missing, they see your hosted form with what to fix.
JSON, from the visitor's browser
Send Content-Type: application/json from any site. You get 200 and { ok: true }, or 400 with a message to show, 404 if the form is off or its link was replaced, and 429 when it's busy.
const res = await fetch("https://boilerplate.fyi/f/YOUR-FORM-KEY/submit", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
name: form.name.value,
email: form.email.value,
phone: form.phone.value,
message: form.message.value,
company_website: "", // the bot trap: always empty
}),
});
const result = await res.json(); // { ok: true } or { ok: false, message: "…" }Send from the visitor's browser, not from your server or a tool like Zapier. Each network can send 5 inquiries every 10 minutes, so a server sending everyone's inquiries soon hits that limit. Have a list of leads to bring in? Use Import CSV in the Leads inbox instead. Requests over 32 KB are refused.
Test it
Two minutes, once it's live. Use an email address you can read.
- Open the live page (not the editor) and send the form as if you were a customer.
- It shows in Leads → Inbox within seconds, scored Hot, Warm or Cold. Open it to see the rules that added up.
- If follow-ups are sending and your templates are approved, your first reply arrives within a minute, from your business name.
- You land on your thank-you message, or on your own thank-you page if you set one.
- Delete the test lead (open it, then Delete this lead) so it doesn't count in your results.
Troubleshooting
Most problems come from where the code was pasted, or from testing the editor instead of the live page.
| What you see | Why | Fix |
|---|---|---|
| The code shows as text on the page | It was pasted into a text block | Delete it and paste it into your builder's code or HTML block instead |
| Nothing shows in the editor | Many builders only run pasted code on the live site | Preview or publish the page, then check it there |
| "This form isn't available" | The form is switched off, or the link was replaced | In Lead settings → Web forms, tick Accepting inquiries, or copy the new link or code |
| "Too many messages at once" | More than 5 inquiries from one network in 10 minutes, or 300 in an hour to one form | Wait a few minutes. When testing, use different devices or networks |
| Submitted, but no lead appears | The hidden company_website field was filled in, or removed and re-added wrongly | Copy the code again from Lead settings and paste it unchanged |
| The lead arrives, but no email goes out | Follow-ups are in test mode, or the templates aren't approved | In Lead settings, check How follow-ups are sent says Sending. In Follow-ups, approve the templates |
| Service shows as empty on the lead | Your form has service choices and the page sent something else | Copy the code again after changing service choices |
| Your own thank-you page doesn't appear | It isn't set, or doesn't start with https:// | Set Thank-you page on your site in the form's settings, starting with https:// |
Getting spam through the form? In Web forms, press New link (old one stops working), then put the new link or code on your site. Your form's link isn't a secret: it can only add inquiries, never read them.
Want us to set it up with you?
We'll put the form on your site with you on a short call. Or email Justin.Tackling@boilerplate.fyi.

