How To: Add a Contact Form to WordPress with a Captcha

You will need to add a contact form to most WordPress installations as they are more user-friendly than simply listing an email address. Once of the most popular free contact form plugins for WordPress is Contact Form 7, so in this guide I will show you how to install it, setup a simple contact page and add a Captcha for security.

Install The Plugins

Download the Contact Form7 plugin and the Really Simple CAPTCHA plugin, then upload it to your wp-content/plugins folder via ftp. You can download a free ftp client called Filezilla for this purpose.

You can also upload the plugin directly, via your wordpress admin panel by clicking Plugins > Add New > Upload > Install Now.

You will also need to enter your ftp settings there as well, your webhost will have provided these when you signed up.

Once the plugin is uploaded, visit your plugins page and click “activate” next to both of the plugins. You will now see a new menu item called “Contact” with a link called “Edit”, click that and we can setup your contact form.

Configuring your Contact Form

By default a basic contact form is created by the plugin, called “Contact Form1”, first of all, lets rename this – hover over where it says “Contact Form 1” and you will see it highlighted in pale yellow, click it and an inputbox appears and you can rename your form. In this tutorial I’ve called it “MyForm”.

Below this, you will see the basic form in html form with various tags, by default the following are included :

  • Your Name (required)
  • Your Email (required)
  • Subject
  • Your Message
  • Send Button

We will leave those inputs and add just one for the Captcha, from the “Generate Tag” dropdown box on the right, choose “CAPTCHA” and a form will appear :

Change the name to “Captcha” and tick the “Large” Image size box. Now we need to copy the tags over to our contact form. Copy and paste the following into your contact form, just before the submit button code :

[sourcecode language=”php”]
<p>[captchac Captcha size:l]</p>
<p>Enter Code from Above : <br/>
[captchar Captcha]
</p>
[/sourcecode]

Enter the email address you wish to receive the contact form emails to and click save. Your contact form is now setup, you need to now place it on a page. Copy the text at the top :

and then go to,  “Pages” > “Add New”.  Name the page “Contact”, go into HTML view in the editor and paste that code into the body and save the page.

Your contact form is now setup, if you visit the page in your browser you should see the form with the CAPTCHA, just test it out to make sure you receive the email ok.

The Contact Form 7 plugin is quite handy, in that you can add as many forms as required. To do this, go back to the “Contact” menu, click “Edit” and at the top you will see a red “Add New” link. Follow the steps above and name the form something else unique.

Leave a Reply