Note: While our most popular guides have been translated into Spanish, some guides are only available in English.

Form Blocks

Use Form Blocks to collect information from visitors. With this block, you can create contact forms, surveys, polls, applications, and other types of forms.

For help with common Form Block issues, visit Troubleshooting form issues.

Before you begin

Watch a video

Add a Form Block

To add a Form Block:

  1. Edit a page or post, click an insert point, and select Form from the menu. For help, visit Adding content with blocks.
  2. In the Build tab of the block editor, set up your form.
  3. Click Storage to add a storage option.
  4. Click Advanced to customize advanced settings.
  5. Click Apply to save your changes.

Set up your form

When you add a Form Block, it includes a default form name and four default fields (Name, Email Address, Subject, and Message) in the Build tab to help you get started.

To set up your form:

  1. Delete New Form in the Form Name field and enter a name for the form. 
  2. To edit any of the default fields, click its Edit button, or click the trash can icon to delete it.
  3. To add new fields to the form, click Add form field. For each field, you can edit the title, add a description, and make the field required.

Keep in mind:

  • If you have multiple contact forms on Squarespace, we recommend using a descriptive form name to help you identify form submissions you receive.
  • The form name only appears to visitors if you set the form to open in a lightbox.
  • Description text won't appear with submitted forms.
  • We recommend a limit of 30 fields to keep your form easy for visitors to complete. This is the field limit for forms connected to Mailchimp.
  • To learn about field options, visit Form fields explained.

Add a storage option

To select where to send form submissions, click the Storage tab. You can connect Form Blocks to an email address, Google Drive, Mailchimp, or Zapier.

To learn more, visit Managing form and newsletter storage.

Customize advanced settings

To customize advanced settings, click the Advanced tab. Options include:

  • Button Alignment - Align the button LeftRight, or Center on the form
  • Lightbox Mode - Set the form to open in a lightbox.
  • Post-Submit HTML - Add HTML code to be rendered alongside the post-submit message. Adding HTML is an advanced modification, and we're unable to troubleshoot custom code related issues
  • Post-Submit Message - Customize the text that displays after visitors submit the form. This won't appear if the form uses a post-submit redirect
  • Post-Submit Redirect - Redirect visitors to another page or site after they submit the form
  • Submit Button Label - Customize the text on the Submit button

Post-submit redirect

To set up the post-submit redirect, click Click to add URL.... To redirect to another website, paste the full URL in the External tab. To redirect to another page on your site, click the Content tab and select the page.

To test a post-submit redirect, submit a form while logged out or in an Incognito browser. Post-submit redirects won't work while logged into your site.

To delete a post-submit redirect, click the trash can icon.

Lightbox mode sets the form to open in a pop-up when a visitor clicks a button instead of showing the Form Block on a page. To do this:

  1. Scroll down in the Advanced tab.
  2. Check Enable Lightbox Mode.
  3. To customize the button label text, use the Open Button Label field. The default text is Open Form.

The lightbox form has a fixed style. It's not possible to change the font, colors, or submit button.

Style the Form Block

You can style some elements of your Form Blocks. Your options depend on your site's version.

Fonts

To style the block's fonts:

  1. From the Pages panel, open a page with a Form Block. 
  2. Return to the Home Menu and click Design, then Fonts.
  3. Under Global Text Styles, click Assign Styles
  4. Scroll to the Form Block section and click each font option to change the style. Keep in mind, if your Form Block doesn't include certain elements, like a Select field with a drop-down menu, you may not see a change.
  5. Click Save.

Colors

To style the block's colors:

  1. In the Home Menu, click Design, then Colors.
  2. Click Section Themes, then click the pencil icon on your theme and scroll to the Form Block section, or click the Form Block on your site to show all relevant tweaks.
  3. Click Save.

Post-submit message

If you add a post-submit message, the text follows these style options:

  • Font - Paragraph settings in the Fonts panel
  • Size - Paragraph 2 slider in the Paragraphs section of the Fonts panel
  • ColorParagraph (Medium) color in the selected section theme

 

Generally, the Form Block's style will follow your template's body text and button tweaks, but options vary depending on your template. To learn more about styling your site, visit Making style changes.

Add reCAPTCHA to reduce spam

After saving the block, you can add Google reCAPTCHA to reduce spam. Visitors will have to prove that they're not robots before completing their submissions. To learn more, visit Adding Google reCAPTCHA to forms.

Track Form Block submissions

To see how visitors engage with your forms, use Form & Button Conversions Analytics. You can track your form submission conversion rate, which compares the number of times a form was viewed with the number of submissions it received.

Was this article helpful?
380 out of 683 found this helpful