Embedding Forms with Squarespace

Your Squarespace account must be on a Business or Commerce plan in order to add custom scripts.

Cognito Forms makes it easy to build powerful contact forms, order forms, and more for your Squarespace website. Adding Cognito Forms to your site with either our Seamless or responsive Iframe embed options takes just a few steps.

You’ll first want to make sure you’ve styled your form the way you want it (more on that below). And you’ll also want your form open in Cognito Forms builder. This way you can easily copy the Seamless Embed Code when you’re ready to paste it into Squarespace.

Done that? Great – from here, it’s a snap.

Squarespace Version and Template Family

  1. Log in to Squarespace in a new browser tab and open your site.
  2. First, determine your site’s version by clicking Help in the left panel.
  3. If your site is on version 7.1 or newer, proceed to step 3. If your site is on version 7.0 with a template that uses Ajax Loading, and you plan to use the Seamless Embed Code, you must disable Ajax Loading in your site’s settings:
    1. Navigate to Design > Style Editor > Site: Loading > Ajax Loading
    2. Uncheck Ajax Loading
  4. Next, open the page where you’d like to add your form and choose the Edit option.
  5. In the content area, click + to add a Block where you’d like to insert the form. (This will open a dialog box.)
  6. Scroll down to the Basic section of the dialog box and select the Code option.
  7. Copy your form’s Seamless embed code or Iframe embed code from the Publish tab in the Cognito Forms builder.
  8. Paste the code into the edit box, and save your changes.

Your form will now appear as a seamless part of your Squarespace site.

Embedded form in Squarespace website.

Quick Tip

Want to style your form to perfectly match the style of your Squarespace site? Make it happen with our Chameleon Mode and Advanced CSS Styling.