Allowing your visitors to contact you is important. It’s a way to get closer to your audience and have them submit suggestions or advice, leading to improvements on your part. Them reaching out also can lead to business partnerships and collaboration, which is all the more reason not to miss out on it. So why not just leave your full name and an e-mail address instead of a contact form? We’ll discuss those right away, so keep reading. To allow you to get in touch with your visitors as soon as possible, let’s show you how to add a contact form in WordPress immediately.
Why should I add a contact form to WordPress?
Here are 4 main reasons to use a contact form in WordPress:
1. Spam protection
Malicious bots scour your website for information they can use, and mailto: email address tag is one of the first. This leads to constant spamming of your inbox. Contact form hides this tag from being publicly visible. It also allows you to add CAPTCHA as an additional security measure.
2. Receive a consistent, concise flow of information
Reading and responding to a large number of e-mails can overwhelm you quickly. Besides long, hard-to-read e-mail, people might leave out some of the information. This requires you to wait for at least one more follow-up response. The contact form allows you to create a clear format and add the required fields.
3. It’s beginner-friendly
The biggest obstacle for people is thinking they need to learn to code. The truth is, they don’t. As you’ll see below, you can customize things and preview changes before you integrate the contact form without coding a single line.
4. It removes redundancy
By this we mean you don’t need to plaster your contact information page after page. A dedicated page and links to it will suffice. Furthermore, you can add quick guides to the FAQ (watch a video, estimated response time, business hours, etc.) as part of the contact form.
You might already have it
WordPress doesn’t have a built-in way to add a contact form. However, a contact form might be added automatically as part of installing a WordPress theme. Check the Page > All Pages section of your WordPress Admin Dashboard for Contact Form or Contact Us. If you like it, customize it and roll with it. However, since it’s usually simplified for staging purposes, and you’ll most likely end up transitioning to a method below.
How to generate a WordPress contact form online
If you don’t want to install WordPress plugins or create custom scripts, you can use tools available online. We’ll demonstrate the process using the Elfsight contact form generator, so use the steps as a point of reference for other services.
How to create a contact form widget using Elfsight
Follow these steps to make a contact form widget with Elfsight:
- Visit Elfsight’s Contact Form Widget page.
- Choose a pre-made template on the left side.
- Click on Continue with this template in the bottom left corner.
- Add, remove, or customize the fields on the form. You can preview changes on the right side.
- Switch over to the Mail tab at the top of the page to add your contact information.
- Use Settings and Appearance tabs to configure behavior or integration, change fonts, size, and color, or add CSS code.
- Click on the Join to Install button.
- Sign in or sign up with your Elfsight account.
- Click on Apply, then Save in the top right corner.
- Select a Contact Form plan.
Lite (free) plan is sufficient for up-and-coming websites, and you can upgrade as your website grows. - A pop-up window will appear. Copy the code under Manually.
- Paste the widget code on a page or post of your liking or create a new one.
- Save changes and test your contact form.
Steps to add a contact form using a WordPress plugin
We already made a list of the best contact plugins for WordPress – feel free to use any of those. We’ll demonstrate the process with WPForms Lite, since it’s free, without major limitations, and easy to customize using drag-and-drop. Here’s how to make and implement a contact form with WPForms Lite:
1. Installing and activating WPForms Lite
The process is identical to installing any WordPress plugin. Search for ‘WPForms Lite’ in the plugin database after accessing WordPress Admin Section. Alternatively, you can download WPForms Lite and install the plugin via FTP.
2. Create and customize a new contact form
A new option, WPForms, has appeared in the main WordPress menu on the left. Click it, then click Add New. Under the Setup tab, give it a name under Form Name, and select one of the pre-made templates. We’ll use a Simple Contact Form as an example.
Switch over to the Fields tab. This allows you to edit current fields or add new ones of all types by dragging and dropping. Even better, you can see how a field works and make alterations on-the-spot. Click on the Save button when you’re done.
3. Configure contact form functionality
Switch over to the Settings tab. Under General, choose basic settings. Under Confirmations, you can choose the type of response a visitor gets when they click on Submit. It can be a simple text response (WPForms will auto-fill a Thank you message) or a redirect to a page of your choice.
Under Confirmations, you can select a follow-up action for you after someone sends a message through the contact form. WPForms will pre-fill the field with the WordPress owner’s e-mail address (the one in the WordPress Dashboard menu’s Settings > General). You can change the e-mail address or add more by separating e-mail addresses with a comma and space. Configure other fields below if needed.
4. Implementing the contact form
Here are 3 main ways to integrate the contact form you just made:
1. On a page or post
When you open a page or post with a Classic Editor, click on the Add Contact Form button above the toolbar and select the form. If you’re using Block Editor, click on the + icon in the top left corner (Add block), and select WPForms under widgets. An empty block will appear. Click on Select a Form and choose your form name in the drop-down list.
2. Using a shortcode
Select WPForms > All Forms in the main menu of the WordPress Dashboard. Every form you made has text in the Shortcode row. Copy the shortcode (for example, [wpforms id=”6″]), paste it anywhere in the text of a page or post, save changes, and it’ll appear on the frontend.
3. As a sidebar
Go to Appearance > Widgets in the WordPress main menu. Find the WPForms widget on the list. Drag it to an area (named and determined by your active WordPress theme, usually Meta or Sidebar) on the right. Enter a Title and Form Name, then click Save. Preview how it looks on your website frontend.