how to add contact form in WordPress

Do you want to know how to add a contact form in WordPress? Or, do you want to create a contact page in WordPress? This guide will help you out.

A contact form allows your visitors and customers to send messages and communicate with you. For instance, they can enquire about your services, or give your products quick feedback. Importantly, it’s a way to establish a strong relationship with your customers.

In this article, we’ve prepared a step-by-step guide on how to create a contact form on your WordPress website. Also, you’ll learn customizing the form, managing settings, and adding it to your contact pages. The best part, you don’t have to touch any code at all.

Let’s begin.

Importance of Contact Form in your Site

Contact Form of SiteNerdy.com
An Example of Contact Form

Having a contact form in your site has numerous benefits, both to site admin and customers. Here are some of them.

  • Easy Communication: Simply, a contact form eases your visitors to get in contact with you. Your customers can send questions, feedback, comments, or any kind of message about related products or services. Then, you can get back to them with a reply.
  • Spam Protection: Imagine exposing your email address on the site, then getting flooded with spam messages. With contact forms, you don’t need to display your email address which saves your email from spam attacks.
  • Reachability: Now we know that direct email is not the option. And, not all people have social media. So, the best way for customers to reach you is with contact forms.
  • Credibility: Having a contact form on your website reflects that you’re a professional. It shows that your business is open to customers’ opinions and queries. This also promotes your customers’ relationship.
  • Convenience: With contact forms, you’re making it easy for your visitors and customers to contact you. They just need to fill in some information name, address, email address, and message.
  • Acquire Visitors’ Details: Visitors provide their personal information like name, address, and others along with the message. So, you get the opportunity to know your customers even more.
  • Email Leads: The contact form also serves as a lead generation tool for email marketing. You can use the email they provide with the form for sending out email campaigns and newsletters.

Choosing the Best Contact Form Plugin

Creating a contact form in your site could be a difficult task if you had to code. However, it’s easier to add the contact form in WordPress with the help of WordPress plugins.

The plugins allow you to design your form with various text fields, buttons, checkboxes, dropdowns, etc. easily and intuitively. And then, you can add the form in different desired places on your site. Also, you can use various settings for notification and confirmation of messages.

There’re a lot of good plugins to build a contact form in WordPress. And, choosing the best one for your site requires some important things that you should look at. So, here’re some of the things you’ll have to consider while choosing a contact form plugin.

  • Ease of use: You should look for a beginner-friendly plugin that requires no coding. It should provide ease in creating and adding forms on any area, page, or post on your site.
  • Features: The plugin should provide you lots of features for making your forms better. You should have features like unique fields, responsiveness, confirmations, notification settings, integrations, etc.
  • Addons: The plugin should support add-ons to add the extra features you need. Features like Google analytics, payment integration, file uploader, pop-ups, reCaptcha, etc. can be achieved with addons.
  • Pricing: The form plugin shouldn’t cost you a lot and should come under your budget.

Now, let’s see some of the popular WordPress form generating Plugins.

i. WPForms

WPForms is a popular, beginner-friendly, and powerful WordPress form plugin. It’s a freemium plugin. It means that the plugin has both free and premium versions available.

WPForms Home Page
WPForms

It has tons of features in the free version too. Whereas, the premium plugin provides more advanced features. It provides a simple drag and drop builder that makes adding form elements easy and intuitive. Also, it has a handful of templates to choose from.

Besides, it allows you to manage various settings like spam protection, customized messages, displaying, styling, etc. You can also manage recipients and customize how the message appears in your inbox.


ii. Ninja Forms

Ninja Forms is a freemium (has both free and paid option) form builder plugin with lots of basic features in the free version and a lot more in the premium. Like WPForms, it also has an intuitive and drag-and-drop editor. However, it’s not very user-friendly.

Ninja Forms Homepage
Ninja Forms

You can create forms using a blank template or edit a premade template. You can use tons of field types, and adjust them as you want. It’s provided with extensions to add the form’s functions like notification, payments, uploader, etc.


iii. Contact Form 7

Contact Form 7 is the most popular free WordPress plugin with over 5 million active installations. It lets you build and manage several forms on a single site at once.

Contact Form 7 WordPress Plugin
Contact Form 7

It’s certainly a powerful and flexible solution for building contact forms supported by third-party add-ons. However, it’s not a very beginner-friendly option in comparison to other plugins. It requires you to have a little HTML coding knowledge.

Steps to Create a Contact Form in your Page

We’re now going to take you through the steps to create a contact form on your WordPress site.

Here, we’re using the WPForms Lite plugin to create the form because it offers to create a form most easily. So, all of the beginners out there can easily follow the same steps we show here and achieve a nice looking form.

Also, WPForms Lite is the free version of this form but has a large number of form designing, building, and configuring options.

Here we go.

Step 1 – Installing the Plugin

First, log in to your WordPress website to go to your site’s admin area.

Then, you need to find and install the WPForms plugin. To do that, go to Plugins > Add New.

Add New WordPress Plugins
Add New Plugin

There, search the plugin with the keyword ‘WPForms’. Then, click on ‘Install Now’.

Install WPForms WordPress Plugin
Install WPForms

Make sure to activate the plugin once it’s installed. After activating, you’ll see a new menu item, WPForms added to the WordPress dashboard.

WPForms In WprdPressDashboard
WPForms In Dashboard

Step 2 – Creating a Contact Form

Now, you can start creating a form. From your WordPress admin area, Go to WPForms > Add New.

Add New Form in WPForms from WordPress Dashboard
Add New Form

Then, you’ll see the form set up page. Start by writing the form name at the top of the page.

And then, select the contact form template and start modifying it. Or, you can also select a blank template to design from scratch.

For now, let’s choose a contact form template to make it easy.

WPForms Setup Contact Form Template
WPForms Setup

After that, you’ll come across the main form-building area. It’ll have a simple form with some fields and a button.

WPForms Form Building Dashboard Area
WPForms Form Building Area

Now, if you want to modify the same fields, then just click on it. From there, you can change the display label, type, field size, etc. You can also change if filling a specific field is required (compulsory) or not.

Editing form fields in WPForms
Editing fields in WPForms

Also, there’re a lot of different fields under ‘Standard Fields’ that you can add in your form. Just click on the field name to add the field.

Adding Form Fields in WPForms
Adding a Field in From

All the fields are editable to a good extent. For that, click on the field you want to edit. Then under the field options, you’ll see a lot of things you can tweak.

Edit a form field in WPForms
Editing a Form Field

You can also delete the existing field. For that, just click on the delete icon next to the field. And then, click on ‘Ok’ for confirming delete.

Deleting a WPForms Field
Deleting a Form Field

Also the best part, the fields are completely drag-and-drop. So, you can place them in any order you like.

Drag and Drop Fields Feature in WPForms
Drag and Drop Fields

After done, click Save at the top-right.

Step 3 – Configuring Form Settings

Next step, you’ll have to manage the settings for your form.

For that, go to Settings on your WPForms screen. There, you’ll see 3 options – General, Notification, and Configuration. Other options are disabled and will be unlocked once you purchase the premium version.

Configuring the WPForms settings is pretty simple. You’ll understand once you see them. Also, you can leave them to default as they’re standard for beginners.

Firstly, go to the General from the settings. There, you’ll see options like name, description, button text, etc. These are just simple settings that you can tweak on your own if you like.

But most importantly, don’t forget to tick the ‘Enable anti-spam protection‘ checkbox that you’ll see at the end of the general settings screen. This’ll prevent spammers from spamming your forms.

WPForms General Settings
General Settings

Next, the notification setting lets you configure how you want to receive emails for contact form messages on your site. So, go to Notification for changing admin emails, subject, and so on.

There, you can enter a custom email address for receiving contact form submission. If you want to add multiple recipients, then separate the email addresses by commas.

Under ‘Email Subject‘, you can customize the subjects for the email that you receive with your contact form.

Similarly, you can edit other fields like senders’ names, emails, and fields you want to receive in your email message.

Notification Settings WPForms
Notification Settings

Now, you might notice ‘Show Smart Tags‘ next to each setting there. They allow you to use the forms fields like name, email address, etc. for notification.

WPForms Smart Tags Fields
WPForms Smart Tags

Lastly, the confirmation settings let you set up confirmation messages for users after they’ve submitted the form.

When you go to Confirmations under settings, you’ll see a few options. Firstly, you can choose the confirmation type i.e. Message, Page, or URL.

If you choose ‘page’, then you can direct the users to one of the web pages on your website.

Or, if you choose ‘URL (Redirect)‘, then you can redirect users to any other pages with a URL. It lets you enter the URL of the page you want to take users to.

However, ‘Message‘ is the ideal choice. This will display a success message as soon as the users submit the form. You can enter the success message that you want to display after choosing the Message option.

WPForms Confirmation Settings
Confirmation Settings

After that, click Save. Then, you can exit.

Step 4 – Adding the Form in a Page

After you’ve completed creating the form, now it’s time to add it to your web page, supposedly a contact page. So, let’s see how to do it.

You can do it on a new page or an existing page.

If you want to add it to a new page, then create a new page first. For that, go to your Dashboard and then go to Pages > Add New.

Add New Page in WordPress
Add New Page

After that, it opens the Gutenberg block editor to create the page. You can add a title, write some description, or add images, texts if you like.

Now, to add the form, you need to add the WPForms block on the page. To do that, click on the block button (plus sign) that you see on the right or top of the page.

Add New Block in Gutenberg Block Editor WordPress
Adding a New Block

On clicking, it’ll open a small window showing various blocks and a search box. Then, search for WPForms and click on the WPForms block.

Searching WPForms Block in Gutenberg Block Editor to add Contact Form
Search WPForms Block

Then, select the form you’ve recently created. In this case, ‘New Contact Form’.

WPForms Select Form with Name
Choosing a Form

Then, publish the page.

Or, if you’ve installed the classic WordPress page editor instead of the Gutenberg editor, then adding the form is easy too. Just click on the ‘Add Form’ button, select the form name, and then click on ‘Add Form’

Adding Form with Classic WordPress Editor
Adding Form with Classic Editor

There you have it. Following these steps, you’d have successfully added the contact form on your page.

Let’s see how our form looks on a live site.

Contact Form Made with WPForms WordPress
Contact Form Example

On filling out the form, we received the confirmation message that we’d configured in the setting.

Confirmation Message sent with WPForms
Confirmation Message

Conclusion

We hope that you learned how to add a contact form in WordPress with the help of this guide. If you haven’t created one already, then you can just do it along step by step.

You may also check our article ‘Best Form Builder Plugins’ for finding more and choosing from more useful WordPress form plugins.

If you need to ask anything about this article, then please comment below.

And, you can also be in touch with us on Facebook and Twitter.

Updated on

Leave a Reply

Your email address will not be published.

Join our Community, Don't Miss an Update!

Get the latest posts and blogs directly to your inbox. Subscribe to our newsletter. Don't worry! We won't spam you like others.