In 2022, staying in touch with your audience is very important. Establishing an email list with a service similar MailChimp helps yous deliver content direct to your subscribers.

Electronic mail lists are peachy, but what if a reader or potential customer wants to get in contact with y'all directly? That's where contact forms come in! In this article, we'll cover how to configure the popular Contact Course seven plugin for your WordPress site.

How to Install Contact Class 7

Contact Form seven has been around since 2009, and it's garnered over 5 million downloads in the by decade. Contact Form vii can be installed directly from the WordPress plugin repository. If you search for "contact form 7", you'll be able to find the plugin along with a diversity of add-ons.

Install the Contact Form 7 plugin from the WordPress plugin repository.
Install the Contact Form seven plugin from the WordPress plugin repository.

Afterward the plugin is installed, you'll see a menu item labeled "Contact" in the sidebar of your WordPress dashboard. This is where all of Contact Form 7'due south settings can exist configured.

Customize Contact Form 7 settings.
Customize Contact Form seven settings.

The Pros and Cons of Having a Contact Form

Before we dive into how to configure Contact Form 7 for your WordPress site, let'due south quickly go through a few of the pros and cons of adding a contact grade to your site.

Pros of Having a Contact Form

  1. A contact course allows readers, customers, and fans to contact you direct. Depending on the purpose of your WordPress site, the ability for a visitor to communicate with you can be very of import. For example, not adding a contact form to an ecommerce site can be financially damaging to your business organisation because interested parties won't be able to accomplish out to you if they have questions near your production.
  2. A contact form adds legitimacy to your WordPress site or business. Many people see the presence of a contact form as a trust gene of sorts. The idea of being able to attain out to you lot, the site possessor, makes your content more than trustworthy.

Cons of Having a Contact Form

  1. Spam tin can be an event for public forms like comment boxes and contact forms. Luckily with Contact Course 7, you tin filter out spam with reCAPTCHA. You can even configure a Cloudflare page rule to protect yourself even farther. Nosotros'll get into the nitty-gritty how to set up spam protection in Contact Class 7 afterwards on in the commodity.
  2. After calculation a contact form to your site, yous'll probable demand to devote fourth dimension to responding to letters. This isn't necessarily a bad thing depending on how you look at it. Some people dread the process of responding to emails, while others genuinely enjoy it. From our experience, the relationships that manifest from having a contact form on your site typically outweigh the price of moderation, so we recommend powering through it!

An Overview of Contact Form 7 Settings

Creating a contact form with the Contact Grade 7 plugin is super easy. To go started, click Contact > Contact Forms in your WordPress sidebar. On this page, y'all can view all of your contact forms along with their associated metadata details.

Contact form in Contact Form 7.
Contact form in Contact Form 7.

When Contact Class seven is first installed, it creates an example form equally well. Before nosotros get into how to create a custom contact course, permit's first take a look at the example course to get a better idea of how Contact Form 7 works. Click on Contact Form 1 to view the form settings.

Configure your WordPress contact form.
Configure your WordPress contact grade.

The "Edit Contact Form" page is split into four sections.

  1. Form – Customize your HTML contact form template with a variety of field options like "text", "email", "checkboxes", etc. You can also write custom HTML in the grade customization box.
  2. Postal service – Customize the email template and settings used for notification emails.
  3. Messages – Customize messages that are displayed after specific deportment. For example, y'all can prepare a unique message to brandish afterwards someone submits a contact form.
  4. Additional Settings – Specify snippets to enable additional features like subscribers-only way, demo mode, and mail skipping.

Now permit's take a closer look at each section and create a custom contact form!

You lot know what they say- keep your friends shut, and your audience closer... or something like that. 😉 Stay connected to site visitors thanks to this pop plugin 👇 Click to Tweet

How to Create a WordPress Contact Form

To create a new contact form, click on Add New next to "Contact Forms".

Create a new contact form in Contact Form 7.
Create a new contact form in Contact Form 7.

Give the new contact form a proper name, and click "Save".

Save your new WordPress contact form.
Save your new WordPress contact form.

In the "Course" section, add the necessary HTML for your contact grade. You can use the various preset buttons to generate shortcodes for popular grade tags. To make things easier, check out the descriptions beneath for the preset form tags that come with Contact Class vii.

  • Text – Create a class tag for a single line of text. Text fields are useful for first names, last names, and other text-based snippets that don't require multiple lines.
  • E-mail – Create a grade tag for an email address.
  • URL – Create a course tag for a URL.
  • Tel – Create a form tag for a phone number.
  • Number – Create a grade tag for a number. Dissimilar the "text" or "text area" input fields, "number" fields only allow numeric digits.
  • Date – Create a form tag for a date.
  • Text Area – Create a class tag for a text area. Unlike the normal "text" input field, a "text area" field allows for multiple lines of text. They're ideal for inputting the body of the message.
  • Drop-downwards Menu – Create a form tag for a drib-downward card.
  • Checkboxes – Create a form tag for checkboxes.
  • Radio Buttons – Create a grade tag for radio buttons.
  • Acceptance – Create a form tag for an acceptance checkbox.
  • Quiz – Create a course tag for a question-answer pair.
  • File – Create a grade tag for a file upload field.
  • Submit – Create a form tag for a submit button.

Now let'southward go ahead and customize a contact grade. For the sake of completeness, we'll create a contact class that uses all the preset form tags in Contact Form 7.

The "Text" Class Tag

When you click on a preset course tag in Contact Form seven, you'll encounter a popup menu similar the one below. In this carte du jour, you tin configure the grade tag's settings. At the bottom, you'll see a shortcode that can be embedded into your contact grade template.

A
A "text" form tag in Contact Grade 7.

For the "text" grade tag, we're using the settings below to create an input field for a name.

  • Field Type – Required Field
  • Name – text-711 (auto-generated)
  • Default Value – Your Name (used as default placeholder text)
  • Akismet – Unchecked
  • ID Aspect (CSS) – cf7-your-name
  • Class Attribute (CSS) – cf7-your-name

These settings generate the shortcode below.

          [text* text-711 id:cf7-your-proper name form:cf7-your-name placeholder "Your Proper name"]        

For now, just click the Insert Tag button to add the course tag to the contact form template. We'll add more than HTML tags to construction the course later on on.

The "Email" Course Tag

Next, we'll create an electronic mail grade tag which will allow our contact form to collect e-mail addresses.

An
An "email" form tag in Contact Form 7.

For the "email" course tag, we've configured the settings below.

  • Field Type – Required Field
  • Proper noun – email-632 (motorcar-generated)
  • Default Value – Your E-mail
  • Akismet – Unchecked.
  • ID Attribute (CSS) – your-electronic mail
  • Class Attribute (CSS) – your-email

These settings generate the shortcode below.

          [email* email-632 id:e-mail class:email placeholder "Your Email"]        

The "URL" Form Tag

In some cases, you may want to have an input field on your contact form for collecting someone'south website. While you can technically use a normal "text" form tag for this in Contact Course 7, we recommend using the "URL" form tag instead. The "URL" form tag will generate an input field that validates URLs to ensure they're formatted correctly.

A
A "URL" form tag in Contact Form seven.

For the "url" form tag, nosotros've configured the settings beneath.

  • Name – url-601 (auto-generated)
  • Default Value – Your Website
  • Akismet – Unchecked.
  • ID Aspect (CSS) – cf7-your-website
  • Form Aspect (CSS) – cf7-your-website

These settings generate the shortcode below.

          [url url-601 id:cf7-your-website form:cf7-your-website "Your Website"]        

The "Tel" Course Tag

Like to URLs, y'all can also employ a standard "text" grade tag to collect phone numbers. Notwithstanding, it's improve to use the "tel" grade tag instead to ensure the phone number is valid.

A
A "tel" form tag in Contact Form seven.

For the "tel" form tag, we've configured the settings below.

  • Name – tel-842 (motorcar-generated)
  • Default Value – Your Phone Number
  • ID Attribute (CSS) – cf7-your-phone-number
  • Class Attribute (CSS) – cf7-your-phone-number

These settings generate the shortcode below.

          [url url-601 id:cf7-your-website form:cf7-your-website "Your Website"]        

The "Appointment" Form Tag

Contact Course 7's "date" form tag lets y'all generate a calendar-fashion date picker. This "engagement" input field is useful for specifying appointment dates in a contact form.

A
A "date" form tag in Contact Form 7.

For the "date" form tag, we've configured the settings below.

  • Name – date-389 (auto-generated)
  • Default Value – Your Appointment Date
  • Range – Our custom date range.
  • ID Attribute (CSS) – cf7-appointment-date
  • Course Attribute (CSS) – cf7-date-engagement

These settings generate the shortcode below.

          [date* date-389 min:2020-09-15 max:2020-10-24 id:cf7-appointment-appointment class:cf7-engagement-date placeholder "Your Appointment Engagement"]        

The "Textarea" Form Tag

The "textarea" class tag lets you create a multi-line text box that lets visitors submit longer messages. Textareas are most useful for capturing the trunk of a bulletin.

A
A "textarea" course tag in Contact Form 7.

For the "textarea" form tag, we've configured the settings beneath.

  • Name – textarea-795 (auto-generated)
  • Default Value – Your Message
  • ID Attribute (CSS) – cf7-your-message
  • Grade Aspect (CSS) – cf7-your-message

These settings generate the shortcode below.

          [textarea* textarea-795 id:cf7-your-message class:cf7-your-message placeholder "Your Message"]        

The "Drop-Downwardly Menu" Form Tag

Contact Form 7's "drop-down menu" form tag lets you create a driblet-downwardly menu with multiple options. Drop-down menus are useful for situations where you lot want a visitor to select a specific choice to submit with the form. For example, if yous run a WordPress maintenance visitor, you lot can configure a drib-downward bill of fare that lets a visitor choose between the services yous offer.

A
A "drib-down bill of fare" form tag in Contact Form 7.

For the "drop-down carte" class tag, nosotros've configured the settings beneath.

  • Name – menu-24 (car-generated)
  • Options – Choice 1, Choice 2, Selection 3, Choice 4
  • Allow Multiple Selections – Checked
  • Insert a Bare Item as the First Option – Checked
  • ID Attribute – cf7-driblet-down-bill of fare
  • Class Attribute – cf7-drop-downward-menu

These settings generate the shortcode below.

          [checkbox* checkbox-948 id:cf7-checkbox grade:cf7-checkbox use_label_element "Option 1" "Option 2" "Option 3"]        

The "Checkbox" Form Tag

The checkbox grade tag lets you lot create HTML checkboxes. Like to drop-downward menus, checkboxes can too be used to select predefined options. Depending on the nature of your contact form, checkboxes may work better than drop-down menus. For case, if you have a small number of options to choose from, a checkbox reduces the number of clicks required to make a selection. On the other hand, if your contact grade has a lot of options, a driblet-down menu may work amend because it takes up less vertical space.

A
A "checkbox" form tag in Contact Form 7.

For the "checkbox" form tag, we've configured the settings beneath.

  • Proper name – checkbox-948 (auto-generated)
  • Options – Option i, Selection 2, Selection three
  • Wrap Each Item with Characterization Chemical element – Checked
  • ID Attribute – cf7-checkbox
  • Form Attribute – cf7-checkbox

These settings generate the shortcode below.

          [checkbox* checkbox-948 id:cf7-checkbox class:cf7-checkbox use_label_element "Pick 1" "Option 2" "Option iii"]        

The "Radio Buttons" Class Tag

The "radio buttons" form tag lets you create radio buttons with multiple options. Unlike checkboxes and driblet-down menus, radio buttons only let you lot to select a single choice.

A
A "radio buttons" class tag in Contact Class seven.

For the "radio buttons" form tag, nosotros've configured the settings below.

  • Proper name – radio-708 (auto-generated)
  • Options – Option 1, Option 2, Option 3
  • Wrap Each Item with Label Element – Checked
  • ID Aspect – cf7-radio
  • Class Attribute – cf7-radio

These settings generate the shortcode below.

          [radio radio-708 id:cf7-radio class:cf7-radio use_label_element default:1 "Selection 1" "Choice 2" "Option iii"]        

The "Acceptance" Form Tag

Contact Grade 7's "acceptance" grade tag tin can exist used to generate a single checkbox for the purpose of accepting terms and conditions. With the credence form tag settings, you can specify a message to brandish.

An
An "acceptance" form tag in Contact Form 7.

For the "acceptance" form tag, nosotros've configured the settings beneath.

  • Proper noun – acceptance-545 (auto-generated)
  • Condition – Check this box to accept the terms.
  • ID Attribute – cf7-acceptance
  • Course Aspect – cf7-acceptance

These settings generate the shortcode beneath.

          [acceptance acceptance-545 id:cf7-acceptance course:cf7-acceptance] Check this box to accept the terms. [/acceptance]        

The "Quiz" Course Tag

The "quiz" form tag can be used to create basic question and answer quizzes in your contact class. To create a quiz question, employ the following format to split the question and answer – Question|Respond. In the screenshot below, our question is "What year was WordPress released?", and the answer (separated by a "|" character) is 2003.

A
A "quiz" form tag in Contact Form 7.

For the "quiz" form tag, nosotros've configured the settings below.

Subscribe At present

  • Proper name – quiz-461 (automobile-generated)
  • Status – Check this box to take the terms.
  • ID Aspect – cf7-quiz
  • Class Attribute – cf7-quiz

These settings generate the shortcode below.

          [quiz quiz-461 id:cf7-quiz form:cf7-quiz "What year was WordPress released?|2003"]        

The "File" Form Tag

Contact Form seven'due south "file" class tag lets you add together file upload functionality to a contact form. This is useful for situations where you want a company to be able to upload an epitome or PDF file to submit with the grade. For case, if y'all run a photography web log with photo galleries that posts guest submissions, you can add together file upload functionality for people to upload images.

In the form tag settings, you lot can specify a multifariousness of settings to secure your grade. We recommend always setting a file size limit to prevent malicious users from uploading huge files. Similarly, specifying "adequate file types" helps yous lock down your course to file formats that you want and expect. With the photography blog example in mind, you may want to limit file size to 1 MB (1024 KB) and acceptable file types to known image formats like JPG and PNG only.

A
A "file" form tag in Contact Form vii.

For the "file" form tag, we've configured the settings below.

  • Proper name – file-658 (motorcar-generated)
  • File Size Limit – 1024kb
  • Acceptable File Types – jpg|png|gif
  • ID Aspect – cf7-file
  • Course Attribute – cf7-file

These settings generate the shortcode below.

          [file file-658 limit:1024kb filetypes:jpg|png|gif id:cf7-file form:cf7-file]        

The "Submit" Course Tag

Last but not to the lowest degree is Contact Course vii's "submit" class tag. As you may have guessed, this form tag lets you generate a submit button for a contact form.

A
A "submit" course tag in Contact Class seven.

For the "submit" form tag, we've configured the settings below.

  • Characterization – Submit
  • ID Attribute – cf7-submit
  • Class Attribute – cf7-submit

These settings generate the shortcode beneath.

          [submit id:cf7-submit class:cf7-submit "Submit"]        

How to Structure a Contact Grade with Form Tags

Now that we have all our class tags set, it's time to create the contact class. At this indicate, your contact form settings should wait like the screenshot beneath. Take note of all the form tags nosotros created to a higher place. With the form tags in place, you can use the [contact-class-7] shortcode to embed the form into a WordPress post or folio.

Embed a contact form with the contact-form-7 shortcode.
Embed a contact form with the contact-form-seven shortcode.

In the WordPress editor, paste the shortcode into an empty block.

Add the Contact Form 7 shortcode to a post or page.
Add the Contact Course 7 shortcode to a post or page.

If you're using the WordPress Classic Editor, you lot tin can paste the shortcode anywhere in the content editor.

Use Contact Form 7 with the WordPress Classic Editor.
Use Contact Grade 7 with the WordPress Classic Editor.

You should now be able to encounter the contact grade on the page where you added the Contact Grade 7 shortcode. Here's what our contact form with the settings mentioned above looks like. As you can see, Contact Form vii automatically converts course tags into valid HTML that renders with the default CSS styles included with your WordPress theme.

A contact form created with Contact Form 7.
A contact form created with Contact Course 7.

Our contact form in its current land is a good starting point, but it'due south lacking one primal feature. Grade tags like "text", "email", and "URL" support placeholders, but other elements like "checkboxes" and "radio buttons" practice not. Without proper labels, the checkbox and radio buttons won't be very useful for visitors because they don't have any context. Luckily, adding labels in Contact Form 7 is very easy!

How to Add together Form Tag Labels in Contact Form 7

There are two ways to add labels to Contact Form seven course tags. For the form tags beneath, y'all tin simply wrap the form tag with a tag.

  • Text
  • Email
  • URL
  • Tel
  • Number
  • Engagement
  • Text Area
  • Acceptance
  • Quiz
  • File

Take a look at the example "text" grade tag below.

          [text* text-711 id:cf7-your-name class:cf7-your-proper noun placeholder "Your Proper noun"]        

To add together a label to this form tag, nosotros tin replace the form tag with the snippet below. Observe the boosted instance of "Your Proper noun" right later the opening <characterization> tag.

          <label> Your Name [text* text-711 id:cf7-your-name class:cf7-your-name placeholder "Your Name"] </label>        

Here'southward what this modify looks like on our contact form. In this case, the newly created label serves the same purpose as the placeholder. All the same, if we didn't want to specify a placeholder within the form tag, so the label would assistance identify the purpose of a specific input box.

Add a label to a form tag in Contact Form 7.
Add a characterization to a class tag in Contact Grade 7.

For class tags that return multiple form controls like checkboxes, radio buttons, and dropdown menus, wrapping the form tag inside a tag results in an error. This happens because a <label> tag is only supposed to be used with a single class control. The nature of checkboxes, radio buttons, and dropdown menu options involve multiple form controls, and so they are incompatible with the default labeling solution.

For checkboxes, radio buttons, and dropdown menus, you have to add a use_label_element parameter within the shortcode. Take a look at the checkbox form tag example below where use_label_element is in bold.

          [checkbox* checkbox-948 id:cf7-checkbox class:cf7-checkbox            use_label_element            "Choice 1" "Option 2" "Choice 3"]        

In one case the use_label_element parameter has been added, you lot tin add together a label direct above the form tag in the contact course editor.

Add a label to checkboxes, radio buttons, and dropdown menus in Contact Form 7.
Add a characterization to checkboxes, radio buttons, and dropdown menus in Contact Class 7.

For the sake of completeness, we've added labels to all the class tags in our contact class. You probably wouldn't demand to practice this for a production site because some form tags already include placeholders. Regardless, we wanted to demonstrate how labels work.

Here'south what our contact form looks like:

A contact form with labels.
A contact grade with labels.

Configuring Mail Settings in Contact Form 7

Now that nosotros've configured the construction of our contact form, information technology's time to accept a wait at the email delivery settings in Contact Class vii. While the default postal service delivery settings should work just fine for well-nigh sites, information technology's still of import to understand the various settings in case your site or use instance requires a special configuration.

To admission the mail commitment settings, go to the contact form editor and select the "Postal service" tab.

Mail delivery settings in Contact Form 7.
Mail commitment settings in Contact Form vii.

Contact Form 7'south post delivery settings allow y'all customize the templates and parameters that are used to generate and transport a notification to you lot afterward someone makes a form submission. If you apply wrong settings, it's possible that you won't be notified of form submissions. Thus, it's of import to examination the form delivery afterwards creating a contact form and irresolute settings.

Contact Grade 7 lets you configure the following mail commitment settings.

  • To – the email address to transport a notification to.
  • From – the electronic mail accost to ship a notification from.
  • Subject – the discipline of the notification e-mail.
  • Additional Headers – specify boosted email headers like "respond-to".
  • Message Torso – the body of the notification email.
  • File Attachments – specify any attachments to include with the notification e-mail.

At present, let'due south go through each setting to get a meliorate understanding of how they can impact mail delivery in Contact Grade 7.

The "To" Field

Exist sure to specify a real email address for the "To" setting. By default, Contact Form seven will assign the email address associated with your WordPress user account to the "To" setting. If your WordPress e-mail accost is not valid, be certain to update information technology in your profile settings and modify the email address in Contact Course 7 also.

The "From" Field

The "From" setting should use the post-obit format –Your Name. For our contact form post settings, we're using kinstalife <[email protected]>.

By default, Contact 7 will fill in this field with [electronic mail protected] . You'll want to make sure that this electronic mail accost is a valid i because some WordPress hosts block outgoing electronic mail to invalid addresses. In that location are multiple ways to brand this email address valid. Yous can either fix a dedicated electronic mail account for [email protected] or you tin can enable catch-all functionality at your email service provider. If you're unable to set up this email address, we recommend irresolute information technology to a valid email accost to avoid deliverability issues.

The "Subject area" Field

The "Subject" setting can be used to specify a field of study line for notification mails. By default, Contact Form 7 sets the field of study as Site Proper name "[your-subject]" – the discipline name in Contact Form 7'southward default form template.

If you don't have a course tag named "[your-subject]" in your form, be certain to change it to something else. For instance, if you only take a grade tag to capture a visitor's proper name (e.thousand. [your-proper name]), yous could modify the discipline line to You've Received a Message from [your-proper noun].

The "Boosted Headers" Field

Nether "Additional Headers", you can specify email headers similar reply-to, CC, and BCC. Past default, Contact Grade 7 adds the post-obit header – Reply-To: [your-e-mail]. This header lets you reply to the email address specified in a submitted contact form.

The default reply-to header is fine if you're using Contact Form 7'due south default electronic mail form tag. If you're non, be sure to change it to lucifer the name of your electronic mail class tag. For our contact grade, the proper noun of the email grade tag is "email-632", and then the reply-to class tag would have to be inverse to Respond-To: [e-mail-632].

The "Message Torso"

Next upward is the "Bulletin Body", which determines the trunk content of the notification email. Contact Grade vii's default template uses [your-name], [your-email], [your-subject area], and [your-message] form tags, and looks like this:

          From: [your-name]  Subject field: [your-subject] Message Body: [your-message] --  This e-postal service was sent from a contact grade on kinstalife (http://kinstalife.com)        

Be sure to change these form tags if yous're not using them in your contact form template. Since the contact course we created collects a lot of information, we tin gear up up the message body with additional course tags similar so:

          How-do-you-do Brian, you've received a message from [text-711] ([email-632]). Website: [url-601] Phone Number: Tel-842 Date Date: date-389 Message: textarea-795        
Customize the message body for Contact Form 7 notification emails.
Customize the message body for Contact Grade 7 notification emails.

Contact Course 7 Mail service Settings – File Attachments

If your contact grade involves uploading a file, you can include the file with the notification e-mail. In our contact form, we have a file upload form tag named "[file-658]". Thus, we can add this form tag under "File Attachments" to ensure the file will exist included with the email notification.

Include file attachments in Contact Form 7 notification emails.
Include file attachments in Contact Form 7 notification emails.

Contact Form 7 Post Delivery Issues

If you find that Contact Class vii is not sending emails, in that location are a few things you can check earlier reaching out to a WordPress programmer for assistance.

  1. Cheque if your server is sending other types of emails. To test this, y'all can trigger another email commitment action past making a test comment on a blog post or submitting a password reset request on your WordPress login page. If yous receive an e-mail afterwards performing one of these actions, then the issue is likely related to Contact Class 7's configuration. If you do not receive emails, achieve out to your host'due south support team and allow them know y'all're having an issue with electronic mail delivery.
  2. Make sure the "To" and "From" fields in your contact form'southward mail service delivery settings are configured correctly. For Contact Form 7 to piece of work properly, both of these fields should exist populated with real email addresses.

Contact Course 7 Form Submission Letters

Contact Form 7 lets you lot customize a diversity of form submission messages. These messages display after a certain status is met. For example, if a company forgets to fill in a required field, Contact Class seven will display a "The field is required" message. For most use cases, the default messages should work just fine. However, if you want to customize the messages, you can exercise so by clicking on the "Messages" tab in the contact form editor.

Customize Contact Form 7 situational messages.
Customize Contact Class seven situational letters.

How to Secure Your Contact Course

As automated bots have gotten smarter and more pervasive over the years, spam has get a major issue for contact forms. Since contact forms are typically open to the public Internet, information technology'due south fairly easy for web scrapers to detect them and burn off spam letters to your email inbox. Fortunately, in that location are various means to ward off spammers and protect your contact form.

Secure Your Contact Grade 7 with reCAPTCHA

If you've ever submitted a form on the Internet, y'all're probably already familiar with reCAPTCHA, a technology developed by Google for identifying automatic bot behavior. Older versions of reCAPTCHA (V2) required users to pass a puzzle or challenge.

The latest version of reCAPTCHA (V3) does not require any interaction from users. Instead, it transparently monitors user activeness in the groundwork to distinguish between human and bot visitors. Since Contact Form 7 supports reCAPTCHA V3, we recommend using this latest version because it provides a better user feel for visitors.

To ready reCAPTCHA, you'll first need to generate an API key. To practice this, log in to your Google business relationship and get to the reCAPTCHA setup page.

Register a new site for reCAPTCHA integration.
Register a new site for reCAPTCHA integration.

Go through the registration grade to create your reCAPTCHA.

  • Label – Specify a label of your choosing.
  • reCAPTCHA Blazon – Contact Form vii supports reCAPTCHA v3, so select that version.
  • Domains – If your site uses a root domain, add the non-world wide web and world wide web version of your domain. If your site uses a subdomain, just add together the subdomain.
  • Owners – The email address associated with your Google account volition be added as an owner past default. Feel complimentary to add together additional e-mail addresses if needed.

Later you've filled in all the options, click Submit. You'll and so be presented with your site-specific "site central" and "secret central". Be sure to continue these keys somewhere prophylactic considering you lot'll need to add them to Contact Class 7.

Google reCAPTCHA site and secret keys.
Google reCAPTCHA site and hole-and-corner keys.

Next, click on "Contact" in your WordPress dashboard sidebar, and click Integration. Select the reCAPTCHA selection, and paste your site cardinal and undercover key into their corresponding fields. Finally, click Save Changes to finalize the reCAPTCHA integration.

Configure reCAPTCHA in Contact Form 7.
Configure reCAPTCHA in Contact Course 7.

Later on configuring reCAPTCHA in Contact Form 7, you'll run across a reCAPTCHA logo in the lower right corner of your contact form page. This means reCAPTCHA is active and protecting your contact form from spam submissions.

WordPress contact form protected by reCAPTCHA V3.
WordPress contact form protected by reCAPTCHA V3.

Secure Your Contact Grade with Cloudflare (Optional)

If y'all utilise Cloudflare to protect your site, you can ready a special page rule for your contact class page to reduce spam contact form submissions.

Protect your contact form with Cloudflare.
Protect your contact grade with Cloudflare.

To add a page rule, click on the "Page Rules" tab, and employ the following settings to assistance secure your contact folio.

  • If the URL Matches – *your-domain.com/your-contact-page/*
  • Browser Integrity Check – On
  • Security Level – High

Cloudflare's "Browser Integrity Check" characteristic analyzes HTTP headers. If it detects an HTTP header that's ordinarily used by automated bot and spammers, it denies the request to your site. Setting the "Security Level" to loftier will challenge all visitors that exhibited malicious beliefs within the past ii weeks.

By limiting these settings to your contact page with the URL lucifer rule, other pages on your site will be unaffected by these page rules. We recommend this configuration because normal "read-only" pages on your site do not typically crave a heightened security level setting.

Don't leave your audition on read. 👀 Get in direct contact with your readers and potential customers through the Contact Grade 7 plugin ⬇️ Click to Tweet

Summary

Contact Form 7 is the most popular contact form plugin and for good reason! It can be used to create everything from basic contact forms, to question-answer quizzes, to circuitous forms that support file attachments and dropdown menus.

Best of all, it comes with built-in reCAPTCHA back up to assistance secure your contact class against spammers.

Do you use Contact Form seven on your WordPress site? If not, what's your preferred choice? Let us know in the comments department below!


Relieve time, costs and maximize site performance with:

  • Instant help from WordPress hosting experts, 24/7.
  • Cloudflare Enterprise integration.
  • Global audience reach with 29 information centers worldwide.
  • Optimization with our built-in Application Functioning Monitoring.

All of that and much more, in one plan with no long-term contracts, assisted migrations, and a 30-twenty-four hour period-money-back-guarantee. Check out our plans or talk to sales to discover the plan that's right for yous.