Since I started using WordPress way back in 2014, I've used a contact form on my website. WPForms wasn't the first form plugin I used (it didn't launch until 2016). But it's certainly the one I've stuck with, primarily because it's easy to use—and it works. You could (and believe me, I have) spend hours grappling with other WordPress form plugins.

WPForms is one of the most popular and powerful WordPress form builder plugins. You can start with one of the 500+ pre-made templates—from contact forms to survey forms, newsletter forms, and registration forms—or create your own from scratch with a blank canvas. But building your chosen form is just the beginning. Underneath are loads of settings to customize each form exactly as you want.

Here, I'll walk you through how to set up confirmation email notifications when someone submits a form, how to combat spam, and how to reduce the number of bogus form submissions. Then, we'll move up a gear and look at how to create a conversational form and customize your forms with conditional logic and CSS.

• Email notifications

• Spam filters

• CAPTCHA

• Conditional logic

• Conversational forms

• CSS customization

1. How to set up email notifications in WPForms

Email notifications containing the form entry fields get sent when a form is submitted. When you create a form, notifications are enabled by default.  

If you don't want to send notifications, you can always switch them off.

1. Sending yourself an email notification

WPForms combines site information like your administrator email address and Smart Tags to populate fields in the notification email. The default notification settings send an email to you, the site administrator, so you know when someone submits a form. But you can edit these settings as you wish.

Let's use a simple contact form as an example.

Send to email address

By default, the Send To Email Address uses the {admin_email} Smart Tag, which pulls the administrator email from your WordPress settings. But you can change or add more email recipients to it.

Note: If you add extra email addresses, separate each one with a comma.

Email subject line

The default email subject line reads: "New Entry:" plus the form's name. For example, "New Entry: Contact Form." You can change this with your own text or Smart Tags. For example, you could have "Contact Inquiry: {field_id= "0"}" where {field_id= "0"} is the name of the person completing the form.

From email

By default, the From Email field uses the {admin_email} Smart Tag. But you can choose a different email address if you want.

Note: In some cases, notification emails can get blocked or marked as spam if the From Email address doesn't match the website domain.

Reply-to email address

By default, the Reply-To Email Address is the {field_id="1"} Smart Tag, which is the user's email address. That way, you can reply to them if you have questions about the form submission.

Email message

The final setting contains the message content from the form. In most cases, the {all_fields} Smart Tag works fine as it includes all user-entered information.

Remember: After making changes, save your settings and test a form submission to see how the email notification looks—and check that it's delivered successfully.

Here's how a basic contact form email notification looks:

But what if you want to send a notification to the user who submitted the form? No problem—here's what to do.

2. Sending additional email notifications

To send an additional notification email, click the Add New Notification button, and name it. (You can always rename it later.)

Now configure the settings to send the notification to the user. 

Send To Email Address

Click Show Smart Tags, and select Email to send it to the user. This displays as {field_id="1"} in the settings:

You can adjust the Email Subject Line, From Email, and Reply-To Email Address settings as above. For example, you may want to change the Email Subject Line to "Contact Form Confirmation" this time.

But you'll definitely want to change the Email Message content to a confirmation email. For example, you might want to say: "Hi [name], thanks for contacting us. We'll be in touch regarding your inquiry as soon as possible." You can even add HTML or inline CSS to format your message:

And remember to save your settings again. Then, whenever there's a submission, first, the user receives a confirmation message:

Plus, you receive an email notification, too:

2. How to combat spam in WPForms

The downside to having a form on your WordPress site is that you're open to receiving spam. WPForms offers four ways to combat spam:

1. Anti-spam protection

2. Country filter

3. Keyword filter

4. Allowlist / denylist

(There are also more security options covered in the next section.)

You can access the Spam Protection and Security settings when you create or edit an existing form:

Let's take a look at each option.

1. Enabling the anti-spam protection 

You'll find the WPForms anti-spam protection feature is switched on by default. Behind the scenes, it prevents bots from sending spam messages by adding a token to each form. 

Tokens are time-sensitive cryptographic strings that are difficult to guess or imitate. If the token does not exist, has expired, or is invalid, WPForms stops processing the form submission. 

2. Adding a country filter

Adding a country filter lets you allow or deny form submissions from selected countries. Enable the option by switching on the Enable country filter. 

Now you have two options. You can either Allow or Deny specific countries depending on your goal. 

For example, if you want to restrict form submissions to one or two countries, select Allow, and then choose the countries from the dropdown list:

Remember to save your changes.

In this example, the form only allows entries from users in Spain or France. If someone attempts to submit the form from another country, they'll see a default message: "Sorry, this form does not accept submissions from your country" (you can edit the message if you want).

On the other hand, if you want to block form submissions from selected countries, select Deny and then choose the countries from the dropdown list:

In this example, the form only blocks entries from users in the UK. If someone attempts to submit the form from the UK, they'll see a default message: "Sorry, this form does not accept submissions from your country."

3. Adding a keyword filter

The keyword filter works by blocking entries with one or more defined keywords.

Enable the option by switching on the Enable keyword filter button and then adding prohibited keywords to your list. For example, you might want to block "crypto" and "cryptocurrency." (Note: The keyword filter is not case-sensitive.)

Remember to save your changes.

When someone attempts to submit your form with a blocked keyword, they'll see a default message that reads, "Sorry, your message can't be submitted because it contains prohibited words" (again, you can edit that if you want).

4. Creating an allowlist or denylist

Another way to combat spam is with an Allowlist or Denylist. This is simply a list of email addresses you allow or block from submitting a form. So, if you were getting lots of spam messages from one address, you could simply add it to your deny list.

Open the form you want to edit. In Field Options > Advanced, use the Allowlist / Denylist dropdown to enable your list and add the email addresses.

3. How to use CAPTCHA in WPForms

A CAPTCHA is an automated challenge-response test that verifies users are human and not spambots. Besides the anti-spam protection features above, WPForms CAPTCHA has three options:

1. reCAPTCHA

2. hCaptcha

3. Custom Captcha

1. Enabling reCAPTCHA

reCAPTCHA is a free spam protection service from Google. You can add reCAPTCHA to your forms by going to Settings and selecting CAPTCHA from the menu.

Click on reCAPTCHA and then choose which type you want:

• V2 checkbox reCAPTCHA: Validates requests with the "I'm not a robot" checkbox.

• V2 invisible reCAPTCHA: Validates requests in the background without requiring any user input.

• V3 reCAPTCHA: Verifies requests with a score.

Each has pros and cons, but I've found the v2 Invisible reCAPTCHA is less intrusive and works fine.

The next step involves setting up Google reCAPTCHA and then entering your:

• Site key

• Secret key

• Fail message

Once you've saved those details, open the form you want to protect, head to Spam Protection and Security, and then toggle on the Enable Google Invisible v2 reCAPTCHA option.

Note: The label on the CAPTCHA switch matches the version of reCAPTCHA you configured. 

2. Enabling hCaptcha

hCaptcha is a free anti-bot solution that protects user privacy. You can add hCaptcha to your forms by going to Settings, selecting CAPTCHA from the menu, and clicking on hCaptcha:

Next, you'll need to generate your hCaptcha keys and add them to your settings:

• Site Key

• Secret Key

• Fail Message

Once you've saved those details, open the form you want to protect, head to Spam Protection and Security, and then toggle on the Enable hCaptcha option.

3. Enabling Custom Captcha

The WPForms Custom Captcha Addon lets you define a custom question-and-answer or math equation to reduce spam form submissions.

First, you'll need to install the Custom Captcha Addon.

Next, open the form you want to secure, and head to the Spam Protection and Security settings. You'll see a Custom Captcha option in the Also Available section:

Click Add to Form to add a Custom Captcha to the bottom of your form. You can choose which type of CAPTCHA to display by selecting Math or Question and Answer from the Type dropdown.

In the Math option, users have to solve a randomly generated equation, like 13 * 4.

In the Question and Answer option, you have to create your own bank of questions and answers. For example: 

• What is the 6th letter of the alphabet?

• What is the capital city of England?

• What is 7+4?

Each time your form loads, users have to answer one random question. If someone enters the wrong answer, they'll see an "Incorrect answer" message:

4. How to use WPForms conditional logic

Using WPForms conditional logic, you can create dynamic forms that collect the most relevant information. For instance, you can show or hide fields or display custom text based on user selection.

For example, if you had a survey form, you could hide specific questions unless a user selects a previous option. Or if you had an inquiry form, you could only show a prospect the next question if their budget is higher than X amount in the previous question.

1. Using OR logic

Let's use a product review form as an example.

At the moment, you can see all the fields on the form. But we're going to add some conditional logic so that the "Product review" text box only displays if the reviewer leaves a 4-star OR 5-star rating.

You can access the Smart Logic settings when you create or edit a form field.

1. Open the Field Options panel.

2. Select the Smart Logic tab. 

3. Switch on Enable Conditional Logic.

Now, we can apply our conditional logic from the dropdown options:

• Show/Hide: Do you want to show or hide the field based on the conditions?

• Select Field: Which field does this logic depend on?

• Condition: What condition do you want to apply? 

  • Choose from: is, is not, empty, not empty, contains, does not contain, starts with, ends with, greater than, and less than.

• Select Choice: What value should the field contain for triggering this condition? 

  • This field is deactivated if you select "empty" or "not empty" from the options above.

Remember, in our example, we want to show the product review text field if the product rating is 4 or 5.

First, we'll create a rule to show this field if the Rating is 4. And then click the Add New Group button to create a second selection:

So now we have our "OR" condition—Rating is 4 or Rating is 5:

Save your changes.

Now, our product review page will only display a product review box if a user selects a 4-star or 5-star rating.

No-star rating example:

4-star rating example:

2. Using AND logic

Let's change our conditions and apply some AND logic.

In this example, if the product under review contains the word "sofa" AND the rating is "greater than 3," then the product review text box will display:

You can experiment with various combinations of AND-OR conditional logic to display the relevant form fields to your audience.

5. How to create conversational forms in WPForms 

Users enjoy a more personal experience when using conversational forms since they're more like face-to-face conversations. Instead of seeing a whole slew of fields to fill in, users are guided one step at a time through the form. Plus, the form displays on its own distraction-free page.

Conversational forms:

• Reduce form abandonment

• Boost from completion rate

• Improve overall form conversions

Let's use a job application form as an example. A standard form can look a little overwhelming:

Here's how to transform it into a more user-friendly conversational form.

1. First, install and activate the Conversational Forms Addon.

2. Then, head to the form you want to convert or create a new form.

3. Next, select Conversational Forms in Settings, and switch on Enable Conversational Form Mode.

Once you've done that, you'll see more options on the page:

Now, let's step through those settings.

Conversational form title and message

The form title appears in large text at the top of your page (it replaces your typical page title). Plus, you can add an optional message:

You can save your settings and preview your conversational form at any time:

Permalink

Next, enter the URL where visitors can access your form. Try to keep it short and memorable, like https://example.com/job-application-form.

Header logo and footer branding

Next, there's a couple of options to upload a logo that displays at the top of your form and hide the "powered by WPForms" branding at the bottom of your page:

Color scheme

Your color scheme choice determines the color of the page background, text, and buttons. You can choose from the default options or click the eyedropper icon to select a custom color scheme, like your brand color:

Progress bar

The final setting lets you choose between a percentage or proportion progress bar. The Percentage format displays percent completed, like "58% completed." And the Proportion format displays the number of steps completed, such as "7 of 12 completed."

Remember to save and test your conversational form settings.

6. How to customize WPForms with CSS 

Most WPForms styling is inherited from your WordPress theme—that's why a simple contact form can look different from site to site. But essentially, it has a basic look-and-feel that fits in with your overall design.

But what if you want to change the appearance of your forms? Maybe you want to change the background color, increase the font size, or add a border.

All of these things are possible with Cascading Style Sheets (CSS). And the good news is that it's pretty simple to apply with WPForms CSS.

There are three main components of CSS.

• Selectors: the "target" that you want to style.

Properties: the style you want to change, such as font size or color

• Values: the desired style effect

For example, look at this snippet of CSS code for a form title:

The components are:

• Selectors: .wpforms-form .wpforms-title

• Properties: font-size

• Values: 36px

Essentially, the CSS says: set the WPForm title to a font size of 36px.

One thing to note is that the CSS code above would apply to all WPForms on your site. So, all your form titles would have a font size of 36px.

If you want to style a particular form, you need to use the form's shortcode and add an extra snippet at the beginning of the selector. For example, this contact form's shortcode is "7":

So, I'd add an extra snippet of code like this:

Let's customize our contact form as an example. 

First, we'll create the code for each component and then apply it to your site using the WordPress Theme Customizer.

Background color

To make the background color on your contact form light orange, you could use:

So it looks like this:

Pro tip: You can find hex color codes here.

Padding

To add some space between the text and the edge of the background color box, you could add 20px padding to the top and bottom and 15px padding to the sides, like this:

Now it looks like this:

Border

To add a solid, dark orange, 2px thick border to your contact form, use this code:

The final version looks like this:

Now you have your custom CSS code ready, it's time to customize your form in WordPress.

Adding your custom CSS using the WordPress Theme Customizer

Traditionally, you'd find the WordPress Theme Customizer in the Appearance menu:

For some themes, like Astra, you'll still see it there.

However, if you're using a block-based theme, like the default Twenty Twenty-Three theme, the Customizer option no longer appears in the Appearance menu. Instead, you'll see an Editor (beta) option to launch the full site editor.

You can still access the original Customizer by adding "customize.php" at the end of your WordPress admin URL: 

https://example.com/wp-admin/customize.php

Pro tip: In time, the site editor might be the place to add your custom CSS, but for now, I'd recommend sticking with the original Customizer.  

So, whatever theme you have, navigate to the Customizer and select Additional CSS from the side menu:

Then copy and paste the CSS code snippet from above into the editor:

And then click Publish at the top of the sidebar. Now you have a CSS-customized contact form.

If you want to customize your forms more, here's a complete list of WPForms CSS selectors with their default styles.

Automate WPForms to make things even easier

You can extend and automate the functionality of WPForms even more with Zapier. It'll let you connect WPForms to all the other apps you use, so you can do things like automatically create leads whenever someone submits a form, let your team know when you have a submission, or save all form entries to a spreadsheet.

I've used several WordPress form plugins over the years, but I've found WPForms to be the most user-friendly to configure and set up. There are hundreds of different types of forms you could add to your site. But whatever form you choose, you can set up a quick confirmation email to let people know you've received their form, reduce the number of spam submissions, and customize your forms with these tips.