As always, here’s the video guide:
If you like the video and want more tutorials on creating a professional website you can also subscribe to our YouTube channel!
Now to the post…
What. Is. Going. On. Yall!
Today we’re gonna show you how to make a WordPress contact form the super easy way.
And for free!!
No matter what kind of site you have – whether it’s an online store, blog, or something else – always important to have a way for customers, clients, even potential partners to get in touch.
Don’t let those golden opportunities slip through the cracks because people don’t know how to reach out!
We’ve got four simple steps to walk through so you can learn how to add a contact form to your WordPress site and keep the growth train rolling.
When we’re done, visitors to your site will be able to fill out their name, email, and message, then you’ll get an email notification so you can follow up!
Alright, let’s get into it.
Table of Contents
- Why Do You Need a WordPress Contact Form?
- The Best WordPress Contact Form Plugin
- How to Add a Contact Form in WordPress: 4 Simple Steps
Why Do You Need a WordPress Contact Form?
Do you really need a contact form on your WordPress site?
Can’t you just add your email address and let people email you that way?
You could. Please don’t.
There was a time (like ’90s to mid-’00s) that most people did this.
And unfortunately, some still do.
Maybe you’re leaning that way because you think you’ll have to learn how to code to add a contact form to your site.
Good news: you definitely don’t friends!
And there are a few good reasons for using a contact form instead of just pasting your email on your contact page:
For us, this is more than enough reason to use a contact form.
If your site gets big enough, sure, create a “hello@[yourdomainname].com” and just know spam will be part of the daily email diet for whoever has to check that inbox.
In the meantime, don’t beg spammers to bombard your personal email by posting it on your website where it’s easily scraped by bots.
If you make visitors send you an email, you’ll get all sorts of different information from them as they try to figure out what you need to know to follow up with them.
Plus, they’ll all have different subject lines – which means you’re more likely to get confused about how/why that person is emailing you, and they’re more likely to forget they sent you that email and what it was about when they see your reply.
Set up your WordPress contact forms right, and you’ll be able to set a specific subject line so everyone knows what’s up, and you’ll be able to automatically collect certain information you need by adding fields for people to fill out before hitting send.
On top of that: when you use a solid WordPress contact form plugin, you can set up automatic confirmations via email or page redirects to let people know that they successfully sent their message and what happens next.
Plain and simple: these days everyone knows what a contact form is and how to fill one out. So if they see yours, it’s that much easier for them to get in touch.
For starters, it’s less digging through your site to hopefully find your email, then copying it, opening a new tab to get to Gmail, then pasting in your email address.
Only to then have to think about what they want to say to you (see above).
Plus, for so many reasons, we sometimes avoid opening our emails (grandma sends us too many “forward this email or you’ll die” chains) – other people do that too!
Don’t make them have to face death or a thousand unopened emails to talk to you.
On top of that, contact forms just look awesome. So much more pro, and that’s what we’re going for here.
The Best WordPress Contact Form Plugin
Like we said above, you DON’T have to learn to code to add a contact form to your WordPress site.
We’ve got plugins friends!
Knowing there’s such a huge demand for these, quite a few WordPress developers have cranked away to create free and paid WordPress contact form plugins for you to choose from.
We’re fans of one simply called “Contact Form” by WPForms.
Besides the “of course this is what I need” name, there are a couple of reasons for that:
- It’s dead simple, super beginner friendly; just drag/drop fields in their builder to create your form, paste a shortcode (more on that later) onto your page, done.
- They’ve got a free version (WPForms Lite), always handy when you’re getting started. Bonus: they have a paid version, so once you get more advanced with your web work you can get additional features you’ll need without having to switch up your plugin/redo everything (that sucks a lot).
Alright, contact form prep work out of the way, let’s dive into this tutorial!
How to Add a Contact Form in WordPress: 4 Simple Steps
Step 1: Install the WPForms WordPress Contact Form Plugin
First, we’ve gotta install that plugin!
From your WordPress dashboard, just head over to the “Plugins” tab, click the “add new” button, then search for “WPForms” and you’ll see it pop up.
Smash that “Install Now” button, then activate and we’ve reached the proverbial “good to go.”
Step 2: Create a Simple Contact Form
Next up, let’s create our new WordPress contact form.
Once you’ve gotten WPForms installed, it’ll send you to a screen to create your first form (if you somehow miss this, just click the “WPForms” tab in your WordPress Dashboard sidebar).
Scroll down and you’ll find the “create your first form” button. Handy, because that’s exactly what we’re trying to do!
Click that sucker and you’ll be taken to a page to get started.
Start by inputting a name for your form, then (for the purposes of this tutorial), select “Blank Contact Form.” WPForms has your back with a few templates like “Simple Contact Form,” “Newsletter Signup Form,” and “Suggestion Form.”
We’re going with “Blank” to show you all the basics, once you get this one done feel free to play with the templates.
From here, just need to click on one of the boxes in the “Add Fields” tab to start adding things to your form.
Name, email, and message (which in WPForms is called “Paragraph Text”) are the basics, so that’s what we added!
Since our paragraph text in this case is for their “Message,” just click on it and that’ll pull up the “Field Options” tab.
You’ll see “Label” there – change that bad boy to “Message.” Boom!]
Next, we’re going over to the settings tab all the way over to the left of your screen.
Here, under “General,” you can change a bunch of settings like the text of your submit button.
For now, we’re just going to head to “Notifications” and change the email address that WPForms will send a notification to when someone submits our form.
Simple enough to do: just input your best email address into the “Send To Email Address.”
Then, head over to “Confirmation” and change the confirmation message if you want something a bit more custom, a bit more snazzy than the default text.
You can also direct them to a different page/URL on your site, for example if you have a fun little “thanks for reaching out, we’ll get back to you ASAP” video to share, you could post that on another page and send people who submit your for to it for bonus “I like you” points.
Done with confirmations?
Sweet, click “Save” and once the little spinning gear icon turns back into a checkmark, click the “x” right next to it to exit out of the form editor.
Step 3: Add the Form to Your WordPress Contact Us Page
Step three, we’ve got to add this WordPress contact form to one of your pages!
First up, create a contact page by mousing over to the “Pages” tab of the WordPress dashboard and clicking “Add New.”
Keeping it simple for the tutorial, we’re naming this page “Contact” (feel free to get fancy with “Contact Us” if you’re feeling it).
Once you’ve added the name/title (that’s what WordPress calls page names), add your contact form by going up to the plus button at the top left of the page, scroll down to “Widgets,” click to open this part up and you’ll see “WPForms.”
Click on that and a dropdown box will pop up on the page that lets you choose a contact form, select the form we just made.
While we’re here, let’s add a bit of heading text to make it abundantly clear to visitors that this is our contact form (not that they’re dumb and don’t realize that, it’s just that we want to make it as clear and easy as possible for them to reach out!).
Click that plus sign again and add a “Heading” block, type out “Contact Me” or whatever you want to call this thing, then slide that heading up above the form.
Then click the blue “Publish” button in the top right corner twice (WordPress really wants to make sure you mean it when you publish a new page) and it’s live!
One more click, this time the “View Page” link that appears to check it out.
Awesome, this is it. But it could look so much better…
Bonus Step: Make Your WordPress Contact Page Look Sweet with Elementor!
Elementor. Our favorite free WordPress page builder plugin.
Install it the same way you installed WPForms (go to plugins -> add new -> search “Elementor” -> Install Now -> Activate).
Then go to your Contact page and at the top, you’ll see a blue “Edit with Elementor” button.
For our tutorial, we’re going to add the form to Dale’s site’s homepage (since it’s already set up with Elementor).
In this case, we’re adding it underneath the “Contact Me” banner (how handy he already had that setup and waiting for us!).
From here, click on the little plus sign under that banner to add a section.
Then go over to “Search Widget” in the sidebar, type in WPForms, then drag/drop it into the new section we just created.
Select the form from the dropdown that appears in the sidebar, select our favorite (and only) form and you’ll see it show up on your page!
Play around with the design from here by clicking the six dots that show up next to the plus sign we clicked earlier to edit the look of your form to your heart’s complete content.
Step 4: Send a Test Email from your WordPress Contact Form
Alright, last step here – let’s test our WordPress contact us form baby out!
Just head over to your contact page (“contact us” if you got fancy) then fill out your form: name, email, quick message (“This is a test” always seems to work for this type of thing).
Smash that submit button then open up the inbox for the email you set your form to send notifications to in step 2.
When we tried this, our test email wasn’t in our inbox.
It went to spam. Thanks Gmail! [facepalm]
We can fix this!
Head over to your email folders on the left side of Gmail, scroll down and click “More,” scroll down again and click the spam folder.
Find your test message in there (we cleared our spam folder for the sake of this tutorial so it was easy, search for the Subject line you set for your form email notifications in step 2 to find it if it’s buried because that’s the more likely scenario).
Once you find and open up the email, you’ll see a nice big “Report Not Spam” button at the top, click that and this test message plus any others your form sends you will end up in your Inbox!
Contact Forms! We’ve got WordPress Contact Forms here!
That’s it friends – how to add a contact form in WordPress!
As always, we hope you found that super helpful.
If you want more tips, tricks, tutorials, step-by-step guides – all the help with creating an awesome, professional website, go check out our Youtube Channel for more of the good stuff!
Rumor has it that for every new subscriber we get, a good boy finds a date to prom…