One of the best features of WordPress is its plug-in architecture, which allows developers and users to do things they could never imagine.

WordPress plug-ins, which are composed of PHP scripts, offer new additions to your site which either add unavailable new features, or enhance otherwise existing features. From search engine optimization to content displaying features like navigation bars and widgets, you can do almost anything with your WordPress site.

The Official WordPress Plug-ins Repository currently has over 31,000 plug-ins, each of which has their own custom functions and features enabling users to extend the functionality of WordPress beyond the core installation. Succinctly, using Plug-ins, you can tailor your WordPress site/blog to your specific requirements.

Due to the immense popularity of WordPress plug-ins, I’ve come up with a tutorial through which you’ll learn:

  • How to install a WordPress plug-in?
  • How to use and configure Contact Form 7 WordPress plug-in?
  • How to insert CAPTCHA into Contact Form 7?

Let’s get started with installing a WordPress plug-in!

How to install a WordPress Plug-in?

Whether you’re a WordPress beginner or expert, installing a WordPress plug-in is quite easy. There are three ways of installing a plug-in in WordPress:

  • Automatically, using WordPress admin panel search option.
  • Manually, using upload method in WordPress admin panel.
  • Manually, via FTP Manager.

Let me describe them one by one!

Automatically, Using WordPress Admin Panel Search Option:

This is by far the simplest way of installing a plug-in onto your WordPress powered website, but the condition is that a plug-in must be in the WordPress plug-in directory. Only free plug-ins that are fully compatible with GPL v2 (or later) and follow WordPress plug-in guidelines are hosted on this directory.

To add a WordPress plug-in, log-in to your WordPress Dashboard and click on Plugins » Add New. You’ll see a Search Box, where you’ve to enter a descriptive keyword or the name of the plug-in.

In the screenshot given below, I’m showing you the example of searching “Contact Form 7” plug-in.

As you can see, the latest version of “Contact Form 7” is displayed at the top of the list of results. Just below the plug-in name, there are two links: “Details” and “Install Now”. Clicking on “Details” link will give you more information about the plug-in, while clicking on “Install Now” lets you install the plug-in.

When you’ll click the “Install Now” link, a popup window will appear on screen, asking if you really want to install the plug-in.

Click on the OK button to continue with the installation. If the installation is successful, the resulting screen will look something like this.

Now, click “Activate Plugin” link to activate the plug-in. Once you’ve activated the plug-in, you’ll get a confirmation message that says “Plugin activated”.

Manually, Using Upload Method in WordPress Admin Panel:

If the plug-in you want to install is not in the official WordPress plug-in repository for some reason either because it is a non-GPL, premium or custom made plug-in, then this method is the perfect choice for you (especially if you’re a novice).

To install a WordPress plug-in using this method, first you would need to download the zip file of that plug-in to your computer from the source. After that, go to your WordPress Admin Panel and navigate to Plugins » Add New menu option.

By default, you will be shown the Search Box where you can search for a plug-in. Instead of searching, click on the “Upload” tab that is available next to the “Search” tab. You will see a screen like this one:

Click on the “Browse” button to browse the downloaded zip file on your computer and upload it. Then, click on the “Install Now” option. The plug-in will be installed automatically on your WordPress site and you’ll be redirected to the “Activate Plug-in” page, as shown in the snapshot below, where you can activate the plug-in.

If the plug-in is successfully activated, you’ll get the confirmation message “Plugin activated” on the top of the page.

Manually, via FTP Manager:

If you have no idea about what an FTP Manager is, then this method is not suitable for you. Installation of a plug-in via FTP requires you to familiar with an FTP software like Filezilla and CuteFTP. If you’re going to use this method, it’s highly recommended to backup your site completely.

To install a WordPress plug-in via this method, follow the procedure given below:

  • Download the latest version of the plug-in.
  • If downloaded plug-in is in zip file format, unzip it.
  • Read the installation and usage instructions, which are typically given in the “readme” file, thoroughly.
  • Connect to your site’s server using FTP, access the path public_html/wp-content/plugins, and upload the unzipped plug-in folder there.
  • Once you’ve uploaded, log-in to your WordPress admin panel and go to Plugins » Installed Plugins. Your newly uploaded plug-in will show up in the plug-in list.
  • Click “Activate” to turn the plug-in on and you are done. If the plug-in activation is successful, a confirmation message will be displayed on the top of the page.

How to Use and Configure Contact Form 7 WordPress Plug-in

Contact Form 7 is a simple but flexible WordPress plug-in that you can use to create and manage multiple contact forms. You can also customize the form and the mail contents with simple markup. It supports AJAX-powered submission, file uploading, Akismet spam filtering, CAPTCHA, and so on.

This plug-in makes use of Ajax technology to send mails. For instance, if the admin of an application want to contact users via emails, then this plug-in is quite useful.
Download this plug-in

How to Display a Form on Your Page:

  • After downloading the plug-in, install and activate it using any of three methods described above in this post.
  • Once the plug-in is activated, you’ll see a menu named “Contact” (just above the “Appearance” menu) in the left hand side of the admin panel. Click on that menu, and a default form named “Contact form 1″ and a Shortcode will be shown like this:
  • Copy the given Shortcode, and place it on the page (by going to edit menu of a particular page) where you want to display the Contact form. Now visit the page, into which you’ve placed the code, you’ll find the contact form there.

How to Customize Your Forms and Mail:

If you think that default form is too simple, and if you want to add some more fields to it, you can edit the form template and add other fields. To customize your form, go to “Contact » Contact form 1 » Edit”.

After clicking, you’ll be taken to admin screen of the form template as shown in the screenshot below:

Now, let me explain every section shown in the figure above one by one:

(1) – Title:
This title is the name of your contact form, which is used only for administrative purposes. When you click on the text of title, it goes into an editable mode where you can change it to fit your interests.

(2) – Shortcode:
As I’ve already mentioned above, you’ve to insert this code into your post, page or text widget content, wherever you want the Contact form to appear.

(3) – Duplicate/Delete:
Using these links, you can duplicate (make a second copy) or delete your contact form.

(4) – Form Editing Box:
Using the form editing field, you can configure the contents of your contact form. Here, you’re allowed to use HTML tags or form-tags. Blank Lines and Line Breaks are automatically formatted with <p> and <br/> HTML tags respectively.

(5) – Tag Generator:
With tag generator, you’ll be able to generate form-tags, even if you’re not familiar with them.

(6) – Mail Template Section:
In this section, you can configure the contents of mail that will be sent to users. In these fields, you can use mail-tags.

(7) – Mail (2) Template Section:
It is an extra mail template, which can be used to send different messages to different recipients using the first mail template.

(8) – Messages:
Here you can edit messages, which will be shown to users in various situations, as per your interest.

(9) – Additional Settings:
You can use this section, if you want to run custom JavaScript or other codes after the form submission. For example, if you want to redirect your users to a “thank you” page after the form has been submitted, then this section will be used to add the custom code.

How to Insert CAPTCHA into Contact Form 7

Contact Form 7 offers you the facility to implement a CAPTCHA into your contact forms to protect them against spam. In order to use CAPTCHA in your contact forms, you first need to install Really Simple CAPTCHA, the officially-sanctioned CAPTCHA module of Contact Form 7.

I’m assuming here that you’ve already installed Really Simple CAPTCHA. So now I’ll explain how you can make use of CAPTCHA with Contact Form 7.

To add a CAPTCHA into your contact form, you need to click on the “Generate Tag” tab, which is located in the admin screen of Contact Form 7. Once you’ve clicked, a dropdown list will be displayed. Look at the snapshot below:

Now, click on the “CAPTCHA” option. You would find yourself on the settings field of CAPTCHA.

Here you can customize CAPTCHA image and input field to fit your site design. If you wish to add extra design and functionality to your CAPTCHA using CSS and JavaScript, you can take advantage of id and class fields.

Copy the image and input field codes, given in the bottom of settings field, and paste them just above <p>[submit "Send"]</p> HTML tag. Click the “Save” button and you’re done!

Here is the screenshot:

Visit your page (on which you’ve displayed contact form) and you’ll see that CAPTCHA has been implemented into your contact form.

Do you know another way of installing a WordPress plug-in?

  • Which plug-in do you prefer to create a contact form in WordPress?
  • Is there any alternative to Really Simple CAPTCHA plug-in for Contact Form 7?
  • What WordPress contact form plug-ins are most popular?
  • Which contact form plug-in is far easier to use and configure than Contact Form 7?

Feel free to share your answers in the comment area!

About The Author:

Ajeet is a professional web developer, associated with WordPressIntegration

WordPressIntegration, a reputed web development company that provides high quality Photoshop to WordPress theme/template conversion service.

Follow @Wordpress_INT to get latest updates via Twitter


Divine Elemente PSD to WordPress

Convert graphics from Adobe Photoshop to a working WordPress theme. No coding.