Thursday 12 March 2015

How to Add a Contact Form to WordPress

It’s important to provide options for people to contact you from your web site. Using a plain email on the page is prone to spam. Using a contact form is a better choice. So let’s do that.

This morning I had a request from a client to setup a contact form on his WordPress site. For some strange reason I didn’t flip on the cam (i.e. the screencast software) to record the process. However…
After I was done adding the form which took about 5 minutes, I started to do some research in Google Suggest to see what I would discuss today for a tutorial that I aim to have published on Tips & Tricks.

Well, the long tail “how to add a contact form to wordpress” jumped out at me. It’s a safe assumption that if one person wants to know how to do something, many others do as well. It is of the same level of safety for the assumption that if Google “suggests” a phrase in auto-complete, people have searched for it in the past.

Therefore, I present this tutorial to you.

Using a Template File or a Plugin for a WordPress Contact Form

I am a fan of using plugins for WordPress functionality, and of leaving the aesthetics to a theme. However, your theme may already have a contact form Template attached to it. If so, you can just create a new page and change the Template to “contact” or something similar and voila you have a contact form.

For this tutorial I will be using the Contact Form 7 plugin. It is available at contactform7.com or in the WordPress.org plugin repository.

To add it you go to the add new plugin screen, do a search for “contact form 7″ then get it downloaded, installed and activated like you would any other plugin.

From there you will create the form. In this tutorial we will just give the form a name and then use all the defaults. This however only scratches the surface of what Contact Form 7 is capable of. I encourage you to explore the possibilities if you need more complex forms.

Creating a Contact Form for WordPress Using the Contact Form 7 Plugin

Once the plugin is installed and activated, follow the steps below to create a contact form.
  1. In the left hand menu, click Contact >> Add New.
  2. Click the Add New button. This extra step is there to allow you to change the language of your contact form if need be.
  3. Give it a title and click the Save button.
This will create a contact form that sends email to your admin email address. It will also use the main fields: name, email, subject, and message for the form. You can add extra stuff in there but we won’t in this tutorial. We are creating just a basic contact form here.

Adding the Contact Form 7 Shortcode to a WordPress Page

The form that we created in the previous steps will have generated a shortcode. To get it, follow the steps below.
  1. In the left hand menu, click Contact >> Contact Forms.
  2. You will see the shortcode next to the form that you created. Right-click it and click copy.
Now you just need to paste the shortcode into a new page. Simply go to Pages >> Add New, give the page a name, then paste in the shortcode into the body area. Then Publish the page, view it, fill out the form and test it out.

You should get an email post haste.


From here you can add the Contact Page to the WordPress menu if it isn’t displayed by default on your site.

No comments:

Post a Comment