hform/guides

Add a Custom HTML Form to Squarespace

Squarespace's built-in Form Block covers the basics, and if it does what you need, keep it. When you want more — your own field layout, an inbox you can export, messages stored where you decide — paste a plain HTML form into a Code Block. It takes a minute.

Step 1 — build your form and copy the HTML

Open the free hform builder, add the fields you want, and press Finish. Tell it where messages should go and you get a small block of HTML with the delivery address already filled in — plus a link to the form's own hosted page. No signup to build; you claim your messages by email when you're ready.

<form action="https://hform.com/s/your-form-id" method="POST">
  <label for="name">Name</label>
  <input id="name" name="name" required>

  <label for="email">Email</label>
  <input id="email" name="email" type="email" required>

  <label for="message">Message</label>
  <textarea id="message" name="message" required></textarea>

  <button>Send</button>
</form>

(The real HTML from the builder also includes an invisible honeypot field that catches spam bots, and a small optional stylesheet.)

Step 2 — add a Code Block where the form should go

Edit the page, click an insert point, and choose Code from the block menu. Make sure the block's type is set to HTML (it is by default).

Step 3 — paste the HTML and save

Paste the form HTML into the block and save. The editor may show a placeholder while editing — the real form appears on the saved page.

Step 4 — send a test message

Open the page as a visitor and submit the form once. When it works, a submission shows your visitor a clean thank-you page (or any page you choose), and the message lands in your email inbox with reply-to set to the sender — answer it like any other email. A copy stays in your hform inbox, downloadable as a spreadsheet.

If your plan doesn’t include Code Blocks

Squarespace has moved features between plans over the years — on some plans code features are limited. If the Code Block isn't available to you, skip embedding: every hform form has its own hosted page at its own address. Add a normal button ("Request a quote") linking to it — no code involved, and it works on every Squarespace plan.

Honest note: for a plain contact form, Squarespace's Form Block is perfectly good. The reasons to bring your own are custom field layouts, EU-stored data you can export any time, and keeping the form portable if you ever move platforms.

A note on personal data

Form submissions are personal data. If EU residents can submit your form, GDPR expects you to say near the form what the data is used for, ask only for what you need, and delete what you no longer use. With hform your messages are stored in the EU (Sweden) with automatic retention limits — and a one-line privacy note under the form ("We use your details only to reply to your message") covers the common small-business case. The full picture, without legalese: GDPR and web forms in plain language.

Quick answers

My editor shows a gray placeholder instead of the form — is it broken?

No — Squarespace often shows a placeholder for code content while editing. Save and view the page as a visitor; the form renders there.

What if my Squarespace plan doesn’t allow Code Blocks?

Use the form’s own hosted page instead: every hform form gets one at its own address. Add a normal button on your Squarespace page linking to it — no code needed on any plan.

Why not just use the Squarespace Form Block?

For a plain contact form, do. A pasted HTML form adds custom field layouts, an exportable EU-stored inbox, reply-to wired to the sender — and it moves with you if you ever leave Squarespace.

Free — no signup

Build your form now

The hform builder gives you clean, accessible form HTML with delivery wired in — press Finish and paste it into Squarespace with the steps above. Free plan included; honest pricing if you outgrow it.

More platforms: WordPress · Shopify · Wix · Webflow · Static sites — or see all guides.