Form Block

The form block is a great way to offer your readers the ability to get in touch or submit information without giving out your personal email address.

Requirements

  1. Note that the form block requires Jetpack plugin to be installed and connected to your WordPress.com account properly.

  2. Jetpack’s Contact Form module also must be enabled. This should be activated by default within your setup, but if it’s not, you can activate it as described here.

Adding Block

To add a form, click on the Add Block button and select the Form block. Alternatively, you can start typing /jetpack in a new paragraph block, then select Form from the drop-down list.

Use the slash command /jetpack then select Form from the drop-down list

Detailed instructions on adding blocks can be found here.

Configuring Email Notifications

Right after inserting the form block to your post or page, you will be prompted to specify where email notifications will be sent when your readers submit the form. You can enter an email address (or multiple comma-separated addresses), and a subject line.

Specify where email notifications will be sent when your readers submit the form

In case you leave these fields blank, the notifications of form submission will be sent to the author of the post or page, and the subject line will be the post/page title.

Insert a default JetPack form to your post or page

Clicking on the Add Form button will insert a default form to your post or page which might contain Name, Email, Website, and Message fields, along with a Submit button.

Customizing The Form

The form block comes with a set of nested blocks and contains other blocks as child components, and this means that each form field is itself an individual block within the main form block.

Any of these internal or child form field blocks can be customized independently and rearranged within the main form block’s container.

Adding A Child Block

In order to append a custom field to the end of your form, hover over the main form block and click the Add block button that appears below the last form field.

Adding internal form field block which can be customized and rearranged within the form’s container

Alternatively, you can click the Add block button at the top of an existing field to prepend a new field above the selected one.

The form block offers the following field options which you can choose from:

  • Name

  • Email

  • Website

  • Multi-line text

  • Text

  • Date Picker

  • Telephone

  • Checkbox

  • Checkbox group

  • Radio

  • Select

Note that the blocks listed above can only be inserted within a Form block.

Rearranging Inner Fields / Blocks

Hovering over the block that you would like to move will enable you to rearrange the selected block within the form block’s container by drag and drop.

Rearrange the selected block within the form block’s container by drag and drop

You can drag any inner block within its form block’s container by clicking and holding the six-dot-grid icon near the top-left corner of each block, or use the up and down arrows to bump a block one spot in the direction you want.