How To Use Contact Form 7
Websites need a way to receive user input and for most websites this is achieved through the use of web forms. Web forms are a great way for a visitor on your site to inquire about your service or product without getting on the phone with you. If you have a WordPress website then you may have come across the free plugin Contact Form 7. In this article I’ll show you how to use Contact Form 7 to capture user inquiries.
Contact Form 7 is the oldest contact form plugin. Over the years it has been improved upon quite a bit following with WordPress best practices. It is simple to set up and use and as we’ll soon see, that it can be customized.
Before we jump into setting up the plugin, let’s run through the features:
- Create unlimited forms
- Configure email addresses to receive form submissions
- Add forms to any page using shortcodes
- Stop spam submissions with the CAPTCHA feature
- Third-party integration unlocks even more features
Installing Contact Form 7
Let’s get started installing this plugin. Head on over to your WordPress admin and click on Plugins -> Add New. On the next page, enter the words Contact Form 7 in the search box on the top right then hit enter. A number of plugins are displayed. You should now see Contact Form 7 in the search results. Click install then activate. Now you’ll be ready to use the plugin. On the left tab section of your dashboard you’ll see a new tab label Contact.
Set Up A New Form
Click on Contact -> Contact Forms. This is where you’ll find all your forms and all edit options. By default, Contact Form 7 creates a form for you. For this article, we’ll skip the default form and build one so you can see how it’s done.
Click on the Add New button as shown below.
On the next page, give your form a title.
Below the title field there are four tabs: Form, Mail, Messages, and Additional Settings. Under Forms, you’ll see a block of code. For most people this set of fields is enough to capture basic information. If you need to add a new field, just click on one of the corresponding field buttons as shown below.
When done with the form fields, lets configure the mail settings. This is how your website will notify you when a user submits a form. Enter the correct emails for the To, and From fields, give it a descriptive subject and optionally add more information in the Message Body section.
If you added a new field on the previous tab then you need to add it in the Message Body section here because it’s not added automatically.
This tab allows you to customize messages that will be displayed to the user in various situations. These situations include when a user successfully submits a form, if there was an error during form submission or if the email could not be sent. Rewrite these messages with the end user in mind so that it’s clear to them what’s going on.
This section allows you to further customize your form with code snippets from various services. This is optional. See more details of this on the Contact Form 7 Plugin Advanced Settings page.
Add Form To Page
We’ll finally add the form we created to a page. Before you click away, make sure you save your work by hitting the blue Save button below the tabs. After saving, go back to Contact -> Contact Forms and you’ll see the new form you just created in the list of forms. Double click the shortcode next to the title of your form and copy it. Now you’re ready to paste it on a web page.
Click on the Pages tab on the left column and find the page you want to add this form to. You can also just create a new page by clicking on the Add New button on the Pages section. In the edit field of the page, paste your code. It should look similar to this:
If your website uses a page builder plugin, then select a HTML or Text element to paste your shortcode into.
Update or publish your page and visit your page on the front-end to see your form. It’s important to test your form before making it live to the public. Fill it out and see if you receive it in your inbox.
Well done! You’ve just completed setting up Contact Form 7. Did you find this how to use contact form 7 article helpful? Feel free to comment about your experience below. Also, if you’re looking for more WordPress posts like this check out the how to articles section of the site.