Most website owners need some type of contact form to gather data on site visitors. Contact Form 7 is a WordPress plugin you can use for free or upgrade to premium for additional features. It is easy to install and use, making it easy even for beginner web designers to utilize.
Some of the trust factors people look for on your website include phone numbers, secure browsing and a simple way to contact you. With that in mind, we looked at some of the contact form plugins for our Plugin of the Month feature.
Siteefy estimates around 193.5 million active websites, with 252,000 new ones created daily. If people don’t trust you to meet their needs, they may just bounce to a competitor. It’s crucial to hit the high notes for every element on your website to convert visitors to customers. Adding a contact form is a must-have for modern sites.
Contact Form 7 Features
Contact Form 7 is free, open-source software created by Takayuki Miyoshi, a WordPress developer. The free version comes with multiple features. Here are some of the best features of the WordPress plugin:
- Variety of form boxes, including drop downs, checkboxes and paragraphs.
- Add CSS style to customize the form without paying extra.
- Integrates with Akismet and Google reCAPTCHA to slow down spam.
- Receive email notifications about form submissions.
- Allow users to upload files.
- Integrates with privacy protection to help with compliance.
Around 71% of Americans worry about the data companies collect on them. By securing your forms and integrating privacy features, you can assuage some of these fears.
Why You Need Contact Form 7
The nearest competitor is WPForms, which offers a more visual block-building approach to creating forms. Those who enjoy the Classic editing format for WordPress will be more drawn to Contact Form 7.
You need some way for site visitors and current customers to contact you. With Contact Form 7, you can create multiple forms to match the needs of different segments of your audience.
Cost to Run Contact Form 7 on Your Site
Contact Form 7 is free to use. The Jetpack CRM extension runs $49 per year and integrates with the plugin. Other addons include Ultimate Addons, Honeypot and Database Addon.
How to Install and Set Up Contact Form 7
We regularly review WordPress plugins. Contact Form 7 is one of the easiest to set up and implement. You will get a standard form that may be a bit difficult to decipher with some color palettes. We’ll talk about how you can input CSS code to customize your forms.
Step 1: Install the Plugin
The simplest way to install Contact Form 7 is to go to your WordPress dashboard/Plugins/Add New and search for the program. Install and activate on your site.
Step 2: Find the Forms
Setting up your forms is simple. You can access the forms dashboard in two ways. In the left sidebar, there is the word Contact with an envelope icon. Click on that to go to the forms dash. Alternatively, you can go to Plugins and scroll down to Contact Form 7 to click on “Settings,” which will take you to the same location.
Step 3: Create a Form
Create a new form by clicking on “Add New.” Contact Form 1 comes preinstalled and is editable.
Choose “Add New Form,” and a preloaded template will appear. Name your form and make any changes you’d like within the code. For a detailed description of what the code does, you can check out the Contact Form 7 documentation.
If you look at the taps on the contact form builder, you’ll see the options:
- Form
- Messages
- Additional Settings
Under mail, you can pinpoint where form submissions get sent. Additional settings allow you to customize the form a bit. If you plan to use the same style for all your forms, you can add the details to your custom CSS for your site’s theme and every new form created will take on the colors and styles you’ve indicated.
If your theme doesn’t allow for a custom CSS box, you may need to go into the code through the backend of your site files.
Some Custom CSS Tips
Here are a few codes you can use to customize the look of your forms:
Change Background for Entire Form
.wpcf7 input[type=”text”]
,
.wpcf7 textarea
{
background-color: #fff;
color: #000;
width: 50%;
}
Customize the Submit Button
/* Contact Form 7 Submit Button
——————————-*/
.wpcf7 input[type=”submit”] {
color: #ffffff;
font-size: 18px;
font-weight: 700;
background: #E2272E;
padding: 15px 25px;
border: none;
border-radius: 5px;
width: auto;
text-transform: uppercase;
letter-spacing: 5px;
}
.wpcf7 input:hover[type=”submit”] {
background: #494949;
transition: all 0.4s ease 0s;
}
.wpcf7 input:active[type=”submit”] {
background: #000000;
}
With any of the codes above, just adjust the colors, fonts, sizing, weight and such to what you want. Have the page pulled up within your theme’s customizer.
If any of the codes won’t work, it may have to do with your theme. A quick search for code snippets may be all you need to make the adjustments to give your site the exact look you desire.
Try for Free
The thing we like best about Contact Forms 7 is that you can install and try it at zero cost. You’ll likely find it meets your basic form building needs. Small businesses on a budget will appreciate the affordability. Installation and creating forms is simple.
