Platform Guide

Squarespace Contact Form

Add a custom contact form that emails you to a Squarespace site

Last updated

To add a custom contact form to a Squarespace page, paste one HTML form into a Code block and add a thank-you page. The form posts to https://api.staticforms.dev/submit with your form's API key, and Static Forms emails each submission to you. The form uses no script, and it works on the Static Forms free plan. Squarespace also has its own form block; this guide is for when you want the form markup and styling in your hands.

Which Squarespace plan you need

Squarespace's custom code page says that on all plans, Code blocks support plain text, HTML, Markdown and CSS in <style> tags, and that adding JavaScript or iframes to a Code block needs the Core, Plus or Advanced plan (or some legacy billing plans). The form below is plain HTML with no script, so it should not need the higher plans. We have not tested it on a live Squarespace site on each plan, so confirm on yours. Squarespace also says its site code cannot run server-side code such as PHP, which this form does not need.

1. Copy the form

Replace YOUR_API_KEY with the key from the General tab of your form in the app, and YOUR-DOMAIN.com with your site address. The key is visible in the page, which is expected: the form API key cannot read submissions.

Code block (mode: HTML)

The visitor's email field becomes the reply-to address on the notification, and every other named field appears in the email. redirectTo must be a full URL. Without it, the visitor sees a plain confirmation from Static Forms instead of your own page.

2. Add it to a page

Squarespace's Code blocks article describes these steps. The exact labels can differ between Squarespace versions and templates.

1

Add a Code block

Open the page for editing, hover over the section, select the add-block control and choose Code.

2

Paste the form

Click the pencil icon on the block, paste the form into the text field, and make sure the Display Source toggle is off. With it on, Squarespace shows your code as text instead of running it. Keep the Mode set to HTML.

3

Create the thank-you page

Add a new page with the URL slug thanks and a short message. Leave it out of the navigation so it is only reached after a submission, and use its full address as the redirectTo value.

4

Save and test

Save the page, then open the live site (not the editor) to test.

3. Test it

Send a message from the live page and check that you land on the thank-you page. The message arrives by email and is listed in the Inbox in the app.

Spam protection

Every submission goes through the built-in spam filter, and the honeypot field catches bots that fill in every field. CAPTCHA widgets and their field names are in the plain HTML guide. A longer walkthrough is in the Squarespace custom form tutorial.

Domain restriction

If you turn on domain restriction (Starter and up), add your site domain. A domain that is not on the list is rejected with a 403 that names it.

Troubleshooting

What you seeWhy, and what to do
The code shows as text on the pageThe Code block's Display Source toggle is on. Turn it off.
401 "Invalid API key"Check that the apiKey value matches the key on the form's General tab, with no extra spaces.
The visitor sees a plain confirmation, not your pageThe redirectTo value is missing or is not a full URL.
A field is missing from the emailGive the input a name attribute.
403 "Submission rejected: Domain … is not in the allowed domains list"Domain restriction is on and your site is not listed. Add your domain on the form's security settings.
No email arrivesCheck your spam folder, then the Inbox in the app: if the submission is listed, the problem is delivery.

FAQ

Does this work on the free plan?

Yes. The snippet only uses Free plan features: 250 submissions every 30 days, 1 form endpoint, email delivery, the built-in spam filter, a honeypot field and reCAPTCHA v2. No credit card is needed.

How do I keep spam out?

Every submission is checked by the built-in spam filter on every plan. The snippet adds a hidden honeypot field (any field whose name contains "honeypot"); bots fill it in and those submissions are dropped. reCAPTCHA v2 is available on Free. Cloudflare Turnstile, hCaptcha, ALTCHA and reCAPTCHA v3 are available from the Starter plan.

Is it safe to put the API key in my HTML?

Yes. The form API key is meant to be public. It cannot read your submissions or sign in to your dashboard.

Do I need a paid Squarespace plan?

Squarespace says Code blocks accept HTML on all plans and that JavaScript or iframes in a Code block need the Core, Plus or Advanced plan. This form is plain HTML, so it needs no script. Confirm on your own plan before relying on it.