A contact form is an integral part of any website.
Contact forms provide a simple and convenient way for people to get in contact with you. It is more secure to use a form than to just have your email address on your website as it can help to reduce unwanted spammy messages.
Fortunately, if you use WordPress it’s very easy to create a contact form using a free plugin called WPForms Lite. And best of all, it doesn’t require any coding!
In this post, I’ll show you how to use the WPForms Lite plugin to create a contact form for your website.
1 | Install the WPForms Lite plugin
As I say, for creating forms I recommend a plugin called WPForms Lite which currently has over 900,000 active installations. There is a paid premium version of this plugin but I just use the free version and it does the job!
To install this plugin, log in to your WordPress admin area and navigate to Plugins and then Add New. On this page, search for “WPForms Lite” and this should bring up a plugin that looks like this:
Click Install Now and then Activate.
2 | Create a contact form
To create a new form, click on WPForms on the left-hand side of the screen.
This will take you to the forms overview page. Any forms you create will be listed here. Click Add New to create a new form.
Start by giving your form a name. I’m going to call mine “Contact” because I’m going to create a contact form. Then, choose a template. Again, as I’m creating a contact form, I’m going to choose Simple Contact Form.
Choosing a template will take you to the form builder. As you can see, this form builder has a drag and drop system so you can add new fields, remove fields and move them around to make the form look exactly how you want it to. With the free version of this plugin (which I’m using here), you will only have access to the standard fields, but this is enough for creating a contact form.
After you have added the fields to the form, you can then edit the fields by hovering over them and just clicking on them.
Clicking on a field in the form will open the options on the left-hand side of the screen. The options for the name field look like this, for example:
As you can see, you can change the label of the field and change the format. I usually like to change the format of the name field to “Simple” when I create a contact form. This means the user doesn’t have to enter a first name and surname in separate fields. You can also add a description to give the user guidance, and you can choose whether or not you want the field to be mandatory.
If you click on Advanced Options you will see that there are even more options including field size, default text, placeholder text, hide label and the ability to add your own class for styling purposes. The good news is the form is responsive by default, so if you don’t want to add any styling then you don’t need to.
Another field I like to add to my contact forms is a subject field. I do this by using a Single Line Text field. This is what my final form looks like:
When you’ve finished designing your form in the form builder, click on Settings on the left-hand side of the screen.
On this page, there are three tabs.
The first tab is General. Here you can change the name you gave to the form earlier (if you wish), give the form a description, change the text on the submit button and change the text that shows while the form is sending
The second tab is Notifications. Here you can change the email address that the email will be sent to (it’s sent to your WordPress admin one by default) and change the subject of the email. I would advise you to leave the rest of the fields as they are.
The third and final tab is Confirmation. Here you can choose what happens after someone submits a form. By default, it is set to show the user a confirmation message, but you can change this to take the user to a page on your website or to an external web page by entering a specific URL.
Once you have finished filling in all these details, click the orange Save button at the top of the page, then click on the X to return to your WordPress admin area. Your form is now ready to use.
If you ever want to edit this form again, go to WPForms in the side menu and then click on the form you want to edit.
3 | Embed the form
Once you have finished creating your form, you can embed it on your website. The best way to do this is to navigate to the page or post that you want to add the form to and then click Add Form.
A pop up will then appear. It will ask you to select which form you would like to embed, and then whether or not you would like to include the form name and description. Once you’ve chosen your options, click Add Form and then you’ll notice that a shortcode has been added to your page.
Then preview your page or post to see how the form looks. Here’s what mine looks like:
Once you’ve added your form to your page, make sure you test it to ensure that it works!
4 | Add reCAPTCHA
This step is optional.
As I mentioned at the beginning of this post, contact forms can help to reduce spam. However, forms aren’t completely immune from spam and so I highly recommend putting measures in place, such as reCAPTCHA, to help reduce spam.
WPForms supports two types of reCAPTCHA. The first is to use a v2 reCAPTCHA, which required the user to tick a box to prove they’re human. The second is to use Invisible reCAPTCHA which doesn’t require the user to take any action. It uses advanced technology to detect if the user is real or not.
To get reCAPTCHA, start by visiting this Google website and click Get reCAPTCHA.
You will then have to log in to your Google Account. If you don’t have a Google Account, check out this post for more details.
The next step is to register a new site (assuming you haven’t use reCAPTCHA before). Enter a label for your site (this can be anything) and then choose the type of reCAPTCHA that you would like to use. Then enter your URL. You don’t need to include the http:// or https:// part of your URL.
Then click to accept the terms and conditions and click Register.
On the next page, you will see two codes; the site key and the secret key. You will need to copy or make a note of these codes and as you need to add these to the reCAPTCHA settings page in WordPress
To get to the reCAPTCHA settings page, go to WPForms then Settings. On the settings page, click on the reCAPTCHA tab.
On this page, choose which type of reCAPTCHA you have opted for. Then enter your site key and secret key. When you’re done, click Save Settings.
To add reCAPTCHA to your form, navigate to your form by going to WPForms and then All Forms. Select the form you want to add reCAPTCHA to, then click on Settings. You’ll notice at the bottom there’s a new option to enable reCAPTCHA. Tick this tickbox and click Save at the top of the screen. And that’s it!
If you chose to use v2 reCAPTCHA then you will be able to see that the reCAPTCHA box has been added to your form.
6 | Add a GDPR field
This step is optional but highly recommended.
In preparation for the implementation of GDPR, new GDPR enhancements have been added to the WPForms plugin.
To activate these enhancements, go to WPForms then Settings. Here you will see the new GDPR setting. Make sure this box is ticked.
Now if you head back into your form builder, you will see that a new field option has been added: GDPR Agreement. This option will add a tickbox to your form. If users tick this box then they are giving their consent for you to use their information so you can respond to their message.
If you add this to your form you will see a new section that looks a little something like this:
You can customise the label and the agreement text if you wish.
More GDPR features are available with the paid version of the plugin.
Hot off the WordPress!
Join my FREE email community today to receive helpful tips and advice on building and maintaining your website directly in your inbox every other Friday. Just pop in your name and email address.
Pin for later?
