How to Set Up a Simple WordPress Contact Form in 30 Seconds

There are few websites these days that don’t have a “Contact” page containing a neatly laid out contact form. Adding a contact form to your site is a great way to help visitors get in touch with you without having to give out your email address.

There are dozens of contact form plugins out there for WordPress sites with all kinds of features, but often all you need is something simple.

In this quick tutorial I’ll show you how to set up a basic contact form.

How to Set Up a Contact Form in WordPress

There are lots of free contact forms available, but for his tutorial we are going to use Contact Widget by WPMU DEV. It allows you to put a contact form in any widgetized area of your site and is a ridiculously simple plugin to use.

Contact Widget
Contact Widget allows you to add a simply contact form as a widget to your site.

It comes with built-in spam protection and options to customize the success message, change the admin email and add custom CSS.

You won’t have to worry about compatibility issues – Contact Widget works with Multisite installations and is easy to set up so every site in your network has their own contact form.

To set up Contact Widget, the first thing you need to do is download and activate the plugin.

A new “Contact Form” widget will appear in your Available Widgets list in Appearance > Widgets. Drag the widget into any widgetized area of your theme. You may want to place the contact form in a sidebar or even in a footer. It’s entirely up to you.Once you’ve placed the widget, click the title and it will expand to reveal a number of pre-filled text areas, which you can edit. You may want to change “Contact Form” to something like, “Contact Me” or “Get in Touch!”

You can also change the admin email from the default if you would prefer emails sent from your contact form are redirected to a different email address.

Fight Spam

reCAPTCHA
reCAPTCHA helps prevent automated abuse of your site (such as comment spam or bogus registrations) by using a CAPTCHA to ensure only humans perform certain actions.

The Contact Widget plugin allows you to enable Captcha to combat spam. Just click the “Enable CAPTCHA” box.

You’ll need to get a reCAPTCHA key to use this feature. Click on “generate a set of API keys here” and you’ll be taken to Google’s reCAPTCHA site.

Fill in the form, click “Create keys” and a set of keys will display on the next page. You’ll need to copy and paste these public and private keys into the corresponding text areas in the Contact Widget.

When you’re done editing the widget, click Save and refresh your site to see your new contact form.

Summing Up

Contact Widget
Contact Widget with the default WordPress theme Twenty Fourteen.

If you’ve got the new default WordPress theme Twenty Fourteen installed, your contact form will look something like this:

I’ve turned on compact mode, which places the Subject, From and Message labels inside the text areas. You can easily turn this off by un-ticking “Compact mode” within the plugin.

The great thing about Contact Widget is that it matches any WordPress theme and if you want to tweak it just add your own custom CSS.

I hope you’ve found this tutorial helpful. What kind of contact form plugin do you use? Share your recommendations in the comments below.

Image credits: Flickr alias.

Comments (4)

  1. Hi Raelene
    I’m a contact form 7 man but this looks good.

    “It comes with built-in spam protection and options to customize the success message, change the admin email and add custom CSS.”

    Those are just the two features that I use.

  2. Looks like a very handy widget. But, as most contact forms are placed in pages/posts I don’t think it is really useful to use such widgets next to using a contact form plugin. You can actually do the same with Contact Form 7 by placing a shortcode in a text widget.

Participate