Layout & Component Blocks

Form

Overview

A clean, mobile-friendly form that web editors create by pasting form embed code into the component.

When to Use

  • Use the Form component when you have third-party embed code—from services like Slate, Salesforce, Formstack, etc.—to add to the page.

How To

Create a Form Component

  1. Navigate to the page you’d like to update, and enter the Edit Mode for the page.
  2. Choose the Section you would like to add the block, click the plus (+) icon.
  3. Select the Form Component from the component list.

Add Intro Text

  1. Form Heading: this acts as the heading introducing the form.
  2. Form Text: enter the body text introducing the form.

Paste Form Embed Code

  1. Paste in the form iFrame or embed code in the Form Embed box.
Screenshot of form component editor
Sample Form - submit disabled
  • Fill out the form
  • We’ll be in touch soon
  • Get ready to meet your moment

* indicates required field.

Best Practices

Component Best Practices

  • Be sure to introduce your form to let users know why you are collecting the information and what to expect. 
  • To create a list with checkmark bullet points, click the bulleted list button in the Form Text WYSIWYG editor. 

Form Best Practices

In the event you are building a form, it might be 

  • Keep forms short. Only include fields that are truly necessary so users aren’t overwhelmed.
  • Use clear, plain-language labels. Write labels that are easy to understand and place them above each field.
  • Clearly mark required fields. Help users know what must be filled out before submitting the form.
  • Provide helpful guidance and messages. Use short instructions and friendly error messages to explain what’s needed and how to fix mistakes.