Giving your visitors a way to contact you is one of the most important parts of your website.
People are most likely visiting your website because they’re seeking information. Sometimes they can’t find what they’re looking for, and other times they might have questions.
Even if you have the options to leave comments on your posts, it’s always good to have a contact form as a general way for people to get in touch with you.
So why a contact form and not an email address you might ask? Depending on your business, you might not always want your email address visible.
If you have something like email@example.com then it’s not a big deal, and you should list it on the website.
But if you haven’t committed to an email address that matches your business yet, I would suggest using a contact form as a way to mask your email. Here’s what I mean:
If you’re email is something goofy like DragonLady1986 or you’re using @gmail, @yahoo, or @anything other than your website, it’s going to look unprofessional to your visitors.
A form allows people to email you without ever seeing your email address.
Another reason to use a contact form is to make it was easy for people to contact you as possible.
Sometimes even copy and paste or waiting for a mail client to open is a big deterrent for people. It’s much easier for them to fill out a form that’s right there in front of them, when all they have to do it type their message and click send.
This video will show you how to add a form to your WordPress website, sync it with your email and imbed it into your website so you can have an easy way for your visitors to contact you.
Here’s a link to the Pojo Forms plugin
First, log into your WordPress dashboard and then hover over “Plugins” on the menu. Select Add New, which takes us to the WordPress repository. We’re going to search for a plugin called Pojo Forms, which is one of the most simple form plugins available. Once you’ve found it, click Install Now. Once installed, click Activate Plugin.
Now, in your dashboard you’ll see a menu item called “Forms”. Hover over it and select Add New.
The first thing we want to go is give our form a name. To keep it simple, we’ll just call it “Contact Form”.
Before we go an further, just remember that we want to make it as simple as possible for people to contact you. So even though we have lots of cool features to choose from with this plugin, we want our contact form to be as minimal as possible to encourage people to use it.
We’re going to add 3 fields. Name, Email, and Message. We’re not going to require a subject line because it’s just an extra step and isn’t really necessary. Instead, the subject line will be used as a way to let you know this email came from your website.
When you’re ready, click “Add Field” to start building your form.
This will be our Name field, so we’ll leave the field type as “Text” and we’ll label this as Your Name.
Click “Add Field” again, and this time we’ll change our field type to “Email” and we’ll label it Your Email.
Last, click “Add Fiend” again, but instead of “Text” we’re going to choose “Text Area”. This gives your visitors a larger area to compose their message. We’ll label it “Your Message” and leave the number of rows at 5 for now.
Now that you’ve finished building your form, you have a few Form Style options below. You can play with these settings if you want, and if you want to change the appearance of the fields you can do so by going to “Form Style” and selecting “Custom Style”. I’m going to leave mine as the default setting.
The same goes for Button Style. You can change the button text or appearance here. Again, I’m going to use the default settings for mine.
Now that you’ve got your form configured, save your draft, and then click “Preview” to see how it looks.
It looks pretty good to me, but I don’t want Name and Email to be on separate lines. I also need to make sure that all these fields are “Required”, so that people can’t send me an email without filling out this information. So we’ll close this and go back to our Field Settings.
For our Name field, I’m going to click Settings to take a look at the advanced options.
Here I’m going to check the “Required” box which makes it mandatory, and I’m going to reduce the Width from 100% down to 50%.
I’ll go down to the Email field and do the same.
Under our Message field, I’m also going to check the “Required” box but leave it as 100% wide. I’m also going to make it a little longer by changing 5 lines to 7.
Now let’s save our draft, and then click Preview to see the updates.
This looks much better. Now all that’s left is to configure it so it knows where to send your email. To do this, we’ll close the preview and look at the Form Options in the right column.
In the “Email To:” box, put your email address. This is how the form knows where to send the information.
“Email Subject” is the subject line your email will have. By default this is set up to let you know this message is coming from your website’s contact form.
The same goes for “From Name”, so we’ll leave that as default as well.
“From Email” is who it says the email is coming from. It’s coming from your website so we’ll leave this alone.
Next is the “Reply-To”option. In order for your email client to know who to reply to, we’ll go back up to the Email field we created and click on the advanced settings again. Copy the Shortcode ID, and then paste that into the “Reply-To” section. Now when someone sends you a message and go to respond, your email client will know which email address you want to reply to.
Lastly you have the “Redirect” option, which allows you to put in a web page to redirect the visitor to after they send you a message. This can be a thank you page, or your homepage. If you leave it blank, it will give them a “Success” message and keep them on the same page. I’m going to leave this blank for now.
The Form Data checkboxes allow you to toggle on and off what information will be collected when a message is sent.
Messages allows you to customize the message your users see when completing your form. I usually leave this as default.
The reCaptcha option protects you from SPAM by making your visitor go through an extra step of validation before sending your message. You only need to worry about this if you find that you’re getting a lot of SPAM mail.
Now that you’re all done, click “Publish”.
Once your form is published, you can imbed it into any page or post on your website with the shortcode. Notice the shortcode on the right side of your screen. Copy this and paste it wherever you want your form to appear. Here I’ve created a page called “Contact Me” and I’ve pasted the shortcode ID into the page and published it. When I view the page, I can see the form I created. All that’s left to do now is give it a test to make sure it’s working.
Fill out your name, email, and a test message. I usually number these so that I know which test was successful if I end up doing multiple tests.
If it’s working properly, you’ll get a success message at the bottom. Now go check your email. You should see the email come through within the next minute or so, but if not remember to check your Junk folder.
Once you see the email come through, it will contain all the information you filled out in the form. If you click “Reply”, it should let you reply to the email address you entered when filling out the form.
With this contact form, you’ve created a simple and convenient way for your visitors to contact you. You’ve also learned how to use the Pojo form builder, which can come in handy for several other types of forms down the road.
Know Someone Who Needs This? Please Share!
[social_sharing style=”style-9″ fb_like_url=”http://bartgriffin.com/how-to-start-a-website-from-scratch” fb_color=”light” fb_lang=”en_GB” fb_text=”recommend” fb_button_text=”Share” tw_lang=”en” tw_button_text=”Share” g_lang=”en-GB” g_button_text=”Share” alignment=”center”]