Platform guide · ~10 min
Connect your Squarespace site to MyFormConnect
Works on: Core, Plus, Advanced and some older plans (Business, Commerce) with the full form code. On the Basic plan, Squarespace allows plain HTML but not scripts, so use the plain version.
- Do "Before you start" on the connect hub and have your form code ready (or the plain version on Basic).
- Edit your contact page. Hover over the section where you want the form, and click Add block (or +).
- Choose Code.
- Click the pencil icon on the block, make sure the type is set to HTML, and paste your form code. Leave Display Source switched off.
- Click outside the block, then Save.
- Test in a private or incognito browser window, or on your phone while logged out. Squarespace doesn't run scripts while you're logged in and editing, so the form may look broken to you when it's fine for visitors.
- Fill in the form and send. Check the alert arrives.
- Once it works, remove the old Squarespace form block.
Common problems
- The form looks broken while editing: that's Squarespace blocking scripts for logged-in editors. Check in a private window.
- You're on the Basic plan and nothing happens: use the plain version.
- The form doesn't send: check your domain in MyFormConnect under Settings → Domains matches your live address, including whether it starts with "www".
Done when: a test enquiry from your live site (checked while logged out) reached your phone.
Your code, ready to paste
Type your IDs below. The code updates in the browser. The placeholder version is always in the page for search and offline reading.
<script src="https://myformconnect.io/loader.js" data-client-id="YOUR_DOMAIN_ID" data-captcha="auto"></script>
<style>
.mfc-form { max-width: 520px; font-family: inherit; display: grid; gap: 14px; }
.mfc-form label { display: grid; gap: 6px; font-size: 16px; }
.mfc-form input, .mfc-form textarea { font: inherit; font-size: 16px; padding: 12px; border: 1px solid #bbb; border-radius: 8px; width: 100%; box-sizing: border-box; }
.mfc-form .mfc-consent { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; }
.mfc-form .mfc-consent input { width: auto; margin-top: 3px; }
.mfc-form button { font: inherit; font-size: 17px; padding: 14px; border: 0; border-radius: 8px; background: #1f5f4a; color: #fff; cursor: pointer; }
.mfc-form .mfc-next { font-size: 14px; margin: 0; opacity: .8; }
</style>
<form class="mfc-form" data-mfc="true" action="https://myformconnect.io/f/YOUR_FORM_ID" method="POST">
<label>Your name
<input type="text" name="name" autocomplete="name" required>
</label>
<label>Email
<input type="email" name="email" autocomplete="email" required>
</label>
<label>Phone (optional)
<input type="tel" name="phone" autocomplete="tel">
</label>
<label>How can we help?
<textarea name="message" rows="4" required></textarea>
</label>
<label class="mfc-consent">
<input type="checkbox" name="consent" value="yes" required>
<span>I agree that Your Business can use these details to reply to my enquiry. <a href="/privacy" target="_top">Privacy</a></span>
</label>
<button type="submit">Get a quote</button>
<p class="mfc-next">We usually reply within a few hours, Monday to Saturday.</p>
</form>
Plain version (no script) — form tag starts like this:
<form class="mfc-form" action="https://myformconnect.io/f/YOUR_FORM_ID" method="POST">