• Blog

    Latest from our Blog

  • Tools

    Our Favourite WP Tools

  • Hosting

    Recommended Web Hosts

  • Coupons

    Get great money off deals

  • Themes

    WordPress Theme Directory

  • Plugins

    WordPress Plugins Directory

  • Promote

    Your WordPress Product

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 :

<p>[captchac Captcha size:l]</p>
<p>Enter Code from Above : <br/>
[captchar Captcha]
</p>

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.


Author:

Oliver Dale is the founder of Kooc Media, a small internet company based in the UK. Kooc Media runs several high-profile websites including WPLift, ThemeFurnace and DesignersTalk.

Leave Yours +

10 Comments

  1. This captcha won’t work, as you will need to install some plugin for that also. So just the form steps are correct, but captcha won’t work.

  2. Karybaez

    Hello
    I did all the steps and still doesn’t show up the contact form, do you know why?

  3. Ancoewien

    Thanks for your clear and instructional manual…a great help. Testing the form + captcha gave me an error on the code (not entered correctly) while the code was correct. The only thing I did not do is: You will also need to enter your ftp settings there as well

    It was nowhere requested and I uploaded the plug-in via my dashboard?

  4. Design100

    Hi, this was VERY helpful. Thank you so much is it possible for the form to load like a thank you page when it has been successfully sent? That would be superb

  5. Vic

    Why not just use contact form with captcha plugin ?
    http://wordpress.org/extend/plugins/contact-form-with-captcha/

  6. Melilla

    Thankss!!! Very usefull

  • Comments are Closed

Search

Our Sponsors