How to add a contact form in WordPress

A website’s contact form helps you lead clear and effective communication with your clients and control the conversation better. As a result, you attract more regular visitors and clients and receive valuable feedback.

Below is an example of a standard contact form on a WordPress page.

In this guide, we will touch on why you need to add a contact form to your WordPress website and how to install it.

It typically includes fields such as name, email address, subject, and message. Some advanced contact form plugins also offer additional features, such as file uploads, dropdown menus, checkboxes, and more.

How to add a contact form to WordPress?

WordPress comes with a lot of built-in features, but a contact form is not one of them. You don’t have to worry, though. There is a wide selection of contact form plugins to choose from, each coming with its own specifics and unique features.

Read further to find out how to choose, install and add a contact form plugin to your WordPress website.

• Step 1.Choose a WordPress contact form plugin

  Your setup should begin with conducting research on the available contact form plugins. All contact forms offer the same basic functionality, but there are plugins with exclusive features that may suit your business better.

  We recommend WPForms, one of WordPress’ most popular and versatile plugins. It has an intuitive interface with a drag-and-drop builder, letting you create beautiful and functional contact forms with ease. Not to mention, it is quite user-friendly, so it is ideal for beginners.

  The free version WPForms Lite comes with all the key features a contact form should possess and is perfect for starting your business.

  The premium version WPForms Pro adds various valuable features such as integration with PayPal, Stripe, customization tools, and many more advanced functions.

  SiteGround users can purchase WPForms Pro at a promotional price from their Client Area > Marketplace > Partner Perks.

• Step 2.Download a contact form plugin

  Once you’ve made your choice, it’s time to download and install the contact form plugin. For this exercise, we are going to use WPForms.

  To begin with, log into your WordPress dashboard. If you have difficulty logging in, check this guide on how to log into your WordPress website.

  Navigate to the Plugins section and select Add New. Use the search bar in the top right corner and type “wpforms”. The first result is Contact Form by WPForms – Drag & Drop Form Builder for WordPress. Click on the button Install Now to download the plugin to your website.

  

  Once the download is complete, Install Now will turn into an Activate button. Press it to activate the plugin.

  

• Step 3.Create a form in WordPress

  The activation will create a new section for WPForms in your WordPress dashboard. Click on WPForms > All Forms to see the list of all existing forms created with the plugin. To create a new one, press the button Add New.

  

  You will enter a new control panel where you can set up your new form. Start by typing a label name for your form in the field Name Your Form. Then, select one of the pre-made templates by hovering over them and pressing the button Use Template. If you wish to start from scratch, hover over the template Blank Form and press Create Blank Form.

  

  The panel will automatically switch to the Fields section, where you can add, edit or remove fields from your contact form.

  Press Add Fields to see the available field types on the left. To add a field, click and hold the mouse button over it, drag it to the right section under your form’s label and release it.

  

  You can add multiple fields and place them in top-down order. After adding all fields, you can re-arrange them by holding the mouse button over a field and dragging it up or down to push the other fields.

  The fields have preset labels, but you can change them. To edit a field, click on it, and the left section of the editor will switch to the tab Field Options.

  In the General sub-section, you can change the field name (Label) and add a description that will appear as text under the field (Description).

  Switching the slider on Required, you can make the field mandatory to complete the form or not. The required fields are marked by a red star symbol next to their labels.

  

  In Advanced and Smart Logic, you can adjust advanced settings like placeholder texts, CSS classes, etc.

  To save the contact form or any new edits to it, click the Save button.

  

• Step 4.Set up the contact form notifications

  Contact form notifications are email messages sent automatically from your website to your email address. This way, you’ll be informed every time a user submits an inquiry in your contact form.

  IMPORTANT! We highly recommend using an SMTP plugin for sending emails to improve your website’s email delivery. Check out this guide for configuring WordPress to use SMTP.

  You can control the notifications settings from the WPForms control panel > Settings > Notifications. WPForms enables the notifications by default, but you can turn them on or off using the slider button Enable Notifications.

  

  Activating the notifications enables the settings section that controls various parameters of the emails. Next to each setting, you can see the Show Smart Tags menu. It allows the contact form to extract information from the visitor’s entry and display it in the email.

  

  Send to Email Address defines the email address that will receive notifications whenever a visitor submits an entry in your contact form. By default, WPForms automatically sets the administrative email address of your WordPress website. This address is specified by the tag {admin_email}. You can replace the address with another email address or add multiple emails separated by a comma.

  

  Email Subject Line defines the subject line of every notification email sent by your contact form. You can change the text or even add smart tags that can display information provided by the visitors in the contact form fields.

  For example, you can set the subject line to show the visitor’s name submitted to the contact form. To do so, open the Show Smart Tags button next to Email Subject Line and select Name from Available Fields.

  

  Now, each new notification will include the visitor’s name in the subject line along with the subject line text.

  

  From Name sets the sender’s name appearing in your email client when you receive the notification. Since your website sends the form, WPForms pulls the Site Title from your WordPress general settings. You can set a custom name or add a smart tag that pulls the name of the visitor who submitted the form.

  

  From Email displays the notification sender address. Since your website sends the contact form notifications, the address is automatically set to the administrative email of your WordPress website. If you use an SMTP plugin and send emails from another address, you can set it in the From Email setting.

  

  IMPORTANT! Make sure to set the email address that you actually use to send email notifications. Spam filters are extremely sensitive to inconsistencies between the From Email address and the actual sender address.

  Reply-To Email Address sets the address in the Reply-to field of the notification email. Should you choose to reply to the notification, this address will be the recipient of the reply. If Reply-To Email Address is empty, the recipient address is the From Email address.

  In general, it is a good idea to include the email address of the visitor that submitted the form. This way, you can communicate further if you have questions about the user’s form submission. You can add a smart tag that fetches the email submitted by the visitor in the contact form.

  

  Email Message defines what the body text of the notification contains. By default, WPForms sets the smart tag {all_fields}, which displays the information of all fields from the contact form. You can customize the body text by showing only selected fields or adding more website information by using other smart tags.

  

  After you’ve finished configuring the notifications settings, press the Save button to confirm them.

• Step 5.Configure the contact form confirmations

  The confirmation is the follow-up action notifying visitors of a successful form submission. It could be a short message, a redirect to another page on your website, or a redirect to an external URL.

  You can configure the confirmation settings from the WPForms control panel > Settings > Confirmations.

  

  WPForms offers three types of confirmation which you can select from the drop-down menu Confirmation Type.

  

  WPForms has already set the Confirmation Type to Message and added a default message. You can change the text in the text editor box.

  Instead of a message, you can choose to redirect the visitors who completed the form to another page on your website. You can do this by selecting Show Page from the Confirmation Type menu.

  The menu Confirmation Page lists all published pages on your WordPress site. Here, you can choose the page visitors will see as confirmation of the successful completion of the contact form.

  

  The last confirmation type is Go to URL (Redirect). A successful contact form submission will redirect visitors to the address you specify in the field Confirmation Redirect URL. The redirect could lead to a page on your website or any external web address.

  

  To save the confirmation settings, press the Save button in the WPForms control panel.

• Step 6.Configure spam protection

  Without any spam protection, your contact form could be an easy target for spam bots. This could litter your email inbox with numerous unwanted messages. Furthermore, spam attacks could overload your SMTP server since the contact form sends emails from your website.

  Therefore, keeping your contact form safe from spam attacks is critical.

  In your form’s control panel, navigate to Settings > Spam Protection and Security.

  

  WPForms has various spam protection mechanisms working in the background. You can turn them off or on by switching the slider Enable anti-spam protection.

  We recommend keeping this option enabled to boost your contact form’s security against spam.

  You can also install addons to increase your form’s security further. From the list Also Available, you can choose from a wide range of premium and free security modules that you can incorporate into your contact form. Some of them require upgrading to WPForms Pro, while others require additional steps to be activated. Click on the Get Started button of the chosen addon to see the detailed instructions.

How to add a contact form to a WordPress page or post

Once you create a contact form, you must determine its location on your website. WordPress lets you add the contact form on any page or post.

The standard setup for most websites is a static page containing the contact form. Usually, this page is called Contact Us or Contacts, and it is the last page in your WordPress navigational menu. For more information, check out this tutorial about WordPress navigational menus.

Adding the contact form is done by editing a page or post from your WordPress page builder.

Adding a contact form in Gutenberg block editor

Gutenberg has been the default WordPress editor since version 5.0. To open it, go to your website’s Pages or Posts section, hover over the page or post, and click Edit. If you are about to create a new page for the contact form, press Add New.

Inside the editor, select the area where you want to place the form and click on the Add block(“+” sign) button. A new pop-up window with the available blocks will appear. Use the search bar, type “wpforms” and select the WPForms block.

Gutenberg will insert the contact form into the selected area. Choose your existing form from the drop-down menu Select a Form.

The form will be displayed as seen by visitors. To confirm the changes to the page, hit the Publish (for a new page) or Update button (for an existing page).

Alternatively, you can insert the contact form by using its shortcode. First, go back to the WPForms section in your WordPress dashboard and select All Forms. Here you can see your existing forms. Copy the code under the form’s corresponding column Shortcode.

Go to the page editor and press the Add block (“+” sign) button. Use the search bar to find the Shortcode block or select it from the full list of blocks.

The block will be inserted into the page. Paste the previously copied shortcode in the Shortcode field. Gutenberg will not visualize the contact form. Press the Update or Publish button and visit the page to confirm the contact form has been inserted.

If done correctly, the page should display the contact form instead of the shortcode.

Adding a contact form in Classic Editor

If you prefer to use the Classic Editor, adding a contact form is done by inserting its shortcode directly into the body area of the page.

WPForms makes things a bit easier. Instead of going back to the plugin’s control panel to obtain the shortcode, WPForms adds an Add Form button in the Classic Editor’s toolbar.

Once you press it, a new pop-up window appears. Select your form from the drop-down menu Select a form below to insert and confirm with the button Add Form.

This will automatically insert the contact form’s shortcode into the page’s body. To save the changes, hit the Update or Publish button.

How to add a contact form to the sidebar

Мany themes feature a sidebar website area. WPForms allows you to add your contact form as a widget to this section.

In your WordPress dashboard, navigate to the section Appearance > Widgets. Click on the Sidebar tab and press the “+” sign (Add block).

A pop-up window listing the available widgets will appear. Use the search bar to find WPForms and select its widget.

The form’s widget block will appear in the sidebar tab. Choose the contact form from the drop-down menu Select a Form.

The widget editor will visualize the contact form in the sidebar tab. Press the Update button to save the changes.

Now, the contact form will be displayed in the sidebar on all pages and posts.

How to test the contact form functionality

Now that the contact form is added to your website in the desired place you should confirm that it is working properly. To do that simply visit your website’s front end and navigate to the page where the contact form is, fill in the required information in the form and submit it.

If you do not receive any messages from your contact form, you should configure your WordPress to use SMTP instead of the PHP mail() function. By default, WordPress uses the PHP mail() function to send emails when needed. This includes sending emails from your contact forms. Many email providers will mark messages sent this way as spam, so these messages may never reach their recipients.

SMTP uses authentication that leads to high email deliverability and thus it is more likely that your contact form emails will get delivered. To configure your WordPress to use SMTP, you can follow the instructions in our comprehensive tutorial.

Why should you add a contact form in WordPress?

Productive communication with clients is the foundation of every successful business. Given that most businesses conduct their operations online, your WordPress website is no exception.

A contact form creates a communication channel between visitors and you, driving new opportunities to attract potential clients.

Below, we’ll list the most prominent advantages of having a contact form on your WordPress website.

• A contact form protects your email address from being exploited – Posting your email address on a public webpage is not always a good idea. It is visible to anyone, including spammers, ill-intended visitors, or malicious bots. Thus, there is a high probability that it could end up being targeted by spam and phishing attacks. The contact form hides your website’s administrative email, reducing the chance of being targeted.

• A contact form helps you seed out spam messages – Spambots are so ubiquitous nowadays that, eventually, every website suffers from their attacks at some point. A contact form helps prevent automated spam attacks by implementing various protection mechanisms.

• A contact form allows you to extract the essential information from your visitors’ inquiries – Some clients prefer to get straight to the point, while others like long expositions. Although that’s not a bad thing, it could be taxing to read long inquiries and filter only the essential information. A contact form allows you to control the conversation better by breaking the contact form into various fields, requiring the visitor to provide specific information.

• A contact form lets you receive feedback from your visitors – Just like comments, a contact form allows visitors to express their opinions on your services or content. The difference is that their feedback is not public, and you will be the only one seeing it.

• A contact form helps you convert more sales – Your services might require price negotiation. Through a contact form, you can negotiate a deal with potential customers on a private channel.

Summary

In a nutshell, you can only benefit from having a contact form on your website. Whether you run an online store or a blog, it lets you communicate with your visitors, receive valuable feedback, or attract more clients.

There are tons of plugins that can add this functionality to your WordPress website. It is only a matter of choosing the one that suits your business best. We hope this article makes things clearer and helps you make the right choice.