The Form block lets readers get in touch with you through your website. Use the Form block to add many types of forms, including a contact form, appointment booking form, event registration form, feedback form, and more!
If you want your visitors to subscribe to your site or sign up for a newsletter, you’ll want to use a Subscribe block or follow our instructions for creating a newsletter.
In this guide
To add the Form block, click the + Block Inserter icon and search for “Form.” Click it to add it to the post or page.
For more, visit our detailed instructions on adding blocks.
💡
Using your keyboard, you can also type
/formon a new line and press enter to quickly add a new Form block.
When you first add the Form block, you will be prompted to select the type of form you want to insert. Select the type that most closely suits your needs. You can edit the form fields after you’ve added the Form block.
💡
If you wish to add a subscription form, use the Subscribe block instead. Learn about Subscribe block here.
Once you have selected the type of form, check the settings on the right to configure a few key settings:
- Email address to send notifications to (more details)
- Email subject line (more details)
- What happens when someone submits the form (more details)
If you are happy with the form, click Publish or Update to make the changes live (the Form block will not work while the page is an unpublished draft.) Alternatively, read on to learn how to further customize your form before publishing.
You can control and customize exactly which fields are shown in your form. When you first add the Form block, you will see a few form fields such as Name and Email to start with.
To add a new form field, click the + Block Inserter icon that appears below the last field, as shown here:
Click Browse All and scroll down to see all the form fields you can choose from:
- Name
- Website
- Text
- Date Picker
- Message
- Phone Number
- Checkbox
- Checkbox Group
- Consent
- Radio
- Select
You can add blocks not specific to forms, such as an image or text.
Once you have added all the fields you wish to have in your form, you can click on any form field to make further changes, including:
- Move it up or down using the arrow buttons.
- Make a field required — meaning it must be filled in before the form is submitted. You can make a form field required by clicking the * button or toggling the Field is required button in the right sidebar.
You may also adjust the width of the field using the Field Width settings on the right. If you set two consecutive fields to 50% width, they will appear on a single line.
You will find additional block settings in the right sidebar when you click on the block. If you do not see the sidebar, you may need to click the Settings icon in the top-right corner to bring up the settings. This icon looks like a square with two uneven columns:
By default, the messages will be sent to the same email address you set in your account settings. If you wish to change the email address that the form messages are sent to, follow these steps:
- Click on the List View button at the top left of the screen (it looks like three horizontal lines). This is marked with a 1 in the image on the right.
- Select the Form (as marked with a 2 in the image on the right.)
- On the right side of your screen, the Form Settings will show a box labeled Email address to send to. Type your email address here.
- You can add multiple email recipients by separating them with commas.
- You can press Update when you’re done to save your changes.
You can use this setting to set the subject line of the emails you receive each time someone sends you a message through your form.
You can use the On Submission option to choose what happens when a visitor to your website submits the form. The options are:
- Show a summary of submitted fields.
- Show a custom text message that you can write.
- Redirect to another webpage, which you can use to send people to another page on your site or any other site.
When someone sends a message using your form, the text “Message Sent” will appear. Using the Message Heading section, you can customize this text.
You will be notified via email whenever someone sends a message through your form.
You can also read all messages sent through your form in your account by going to Feedback in the left sidebar of your site dashboard.
Feedback is managed much like comments. If feedback is spammy, hover over it and click Spam. If you want to delete feedback, hover over it and click Trash. Or, if legitimate feedback is marked as spam, you can click Not Spam.
Akismet is our built-in spam filter. This feature is automatically active on your site. If spam gets through our filter, you can flag feedback from the Form block as spam.
- Go to Feedback → Form Responses in your WordPress.com dashboard.
- Locate the form response and hover over the sender’s name.
- Click Spam to report the form response as spam.
Additionally, to protect your form submissions from spam and unwanted content, you can add keywords, usernames, IP addresses, email addresses, and more to the Disallowed Comments section. This section is available from Settings → Discussion.
Feedback matching the words added to Disallowed Comments will be sent directly to Trash within the Feedback section.
You can install a CAPTCHA plugin if you have a plugin-enabled site. Make sure the plugin you choose is compatible with Jetpack forms. Or, if you choose to use a contact form plugin instead of our Form block, the CAPTCHA functionality is compatible with the form you are using.
- This method is not secure: A form is not a secure method for collecting private information, such as credit card numbers, bank account numbers, usernames, passwords, etc., because the information is transmitted via email. To collect payments, use the Payments block or a similar payment processing service that securely handles financial transactions.
- Built-in spam filter: We filter submissions through Akismet to fight spam, then add them to your feedback management area accessible to Editors and Administrators on your site. We also email a copy to you.
- Available on WordPress.org: If you’re running your copy of WordPress.org, you can use the Jetpack plugin to get this functionality.
- Reply back: If you would like to reply to a contact form submission, you will need to use your email to do so. You can reply with a custom email address by creating an account with an email provider listed here.
If you created a new form and are testing to ensure the form is working, make sure you use real information. Often, fake information looks like spam, so it can get filtered by our Akismet spam protection.
How to check if a form submission has been flagged as spam:
- Go to Feedback → Form Responses.
- Click Spam at the top of the form responses dashboard.
- Look for the missing message in Spam.
If the submission is in Spam and should not be marked as spam, you can hover over the message and click Not Spam.
For more troubleshooting tips on receiving contact form submissions, check out this Troubleshooting Guide.
The advanced settings allow you to an HTML anchor and additional CSS classes for the current block.
You can also learn more about adding additional CSS classes to blocks here.
Note: The instructions from this guide are referring to the Classic Editor. If you are using the WordPress block editor, please see this guide.
This is not a secure method for collecting private information, such as credit card numbers, bank account numbers, usernames, passwords, etc. To collect payments, please use PayPal or a similar payment processing service that securely handles financial transactions.
Video Tutorial
How to Add the Contact Form
Editing the Contact Form
Seeing Your Own Contact Information Pre-Filled in the Form
Adding a Contact Form With Shortcodes
Watch the video below for a quick overview of how it works, and read below for more examples and settings.
- Go to Pages or Posts in the left sidebar of your site dashboard.
- Select the post or page you want to add the form to, or add a new one.
- Above the toolbar, click Add Contact Form.
The contact form comes with four predefined fields: Name, Email, Website and Comment.
You’re free to edit, delete or add more fields to your form. Note that you can decide to make your field required or not.
Select the Edit button at the top to edit the form settings.
Notification Preferences
- By default, when a visitor submits your contact form, it will be emailed to the author of the post or page using the email address that they have on file for their WordPress.com account.
- The subject line will be the title of the post if you don’t add custom text.
- You can change both the recipient and the email subject of your emails from the options at the top of the form editing area.
- Separate recipient emails with a comma to send to multiple recipients.
- You can also change the email address and subject using shortcode, as discussed below.
Contact Form Fields
Each field requires a label and a field type. You can choose among the following field types:
- Checkbox: allows the user to tick a box to make a choice
- Dropdown: creates a dropdown of options
- Email Address: requires an email address format
- Name: text field
- Radio Button: similar to the checkbox field type
- Text: a single line of text
- Text Area: several lines of text
- Web Address: requires a URL format
- Once you have added the fields that you want, click the Update Form button to save the changes and add it to your post or page.
Once you are finished adding fields and setting notification preferences, select the Insert button to add it to the post or page.
After you’ve added a contact form, you can add or edit fields and access the settings tab by clicking on the form, then selecting the pencil icon. Make the changes you want, then select Update.
If you visit your live site to view your contact form, you may see your contact information is pre-filled in. Only you see this information because you are viewing your site while being logged into your WordPress.com account.
- Logged-in WordPress.com visitors to your site will see contact forms auto-populated with their own information.
- Visitors who are not logged in will not see any information automatically filled in.
- You can test this by logging out of WordPress.com and viewing contact forms – they will appear empty.
- This feature does not apply to self-hosted sites using Jetpack.
You can add a basic contact form using a WordPress specific code called a shortcode. You can read more about shortcodes here.
To add a contact form using a shortcode, copy and paste the text below to any post, page, or text widget:
[contact-form]
[contact-field label="Name" type="name" required="true" /]
[contact-field label="Email" type="email" placeholder="Your Email Address" required="true" /]
[contact-field label="Website" type="url" /]
[contact-field label="Comment" type="textarea" required="true" /]
[/contact-form]
- Each contact form shortcode must start with [contact-form] and end with [/contact-form]
- Within the [contact-form]] codes, each individual field is wrapped in a [contact-field /] tag
- Fields can be added or removed from the shortcode manually. For instance, if you wished to remove the website textbox, you’d remove that line, like this:
[[contact-form]
[contact-field label="Name" type="name" required="true" /]
[contact-field label="Email" type="email" placeholder="Your Email Address" required="true" /]
[contact-field label="Comment" type="textarea" required="true" /]
[/contact-form]
Available Shortcode Field Attributes
The available field attributes are as follows:
label: Gives the field a descriptive label.
type: Determines what kind of field you add. Available options include:
text: Displays a regular single line text boxtextarea: Displays a multi-line text boxradio: Displays radio optionscheckbox: Displays a single checkboxselect: Displays a drop down with multiple optionsemail: Displays a single line text boxname: Displays a single line text boxurl: Displays a single line text box
options: Select and radio fields have a fourth option called “options”. This is a comma separated list of all the options available within the drop-down or radio field. An example would be:
[contact-field label="Do you have a blog?" type="radio" options="Yes,No" /]
You can also change notification preferences for an embedded contact form by adding the following parameters to the opening contact-form tag:
to='email address': The email address where the submitted form notifications should be sent.subject='email subject': What appears in the subject line for email notifications.
For example:
[contact-form to='email@yourgroovydomain.com' subject='Form Submitted']
This code would send an email notification with the subject line “Form Submitted” to the email address email@yourgroovydomain.com.
Changing Submit Button Text
submit_button_text: Allows you to change the contact form button text from “Submit” to anything you like. In the example below, the button would display “Contact me!” inside the button:
[contact-form submit_button_text='Contact me!'][contact-field label='Name' type='name'/][/contact-form]
placeholder: Sets placeholder or descriptive text inside an input field until it is filled. This text disappears when you start typing in the field. Not available for radio, select, and checkbox fields.
required: If you’d like the field to be required, add required="true" or required ="1" to the shortcode. If not, leave this out.
