how-to-create-a-conversational-contact-form_g

How to Create a Conversational Contact Form (Easily)

Do you want to build conversational contact forms for your WordPress website?

Using conversational forms can help explode your conversion rate, get you more leads, and get you more customers online.

So in this guide, we’ve put together a step-by-step tutorial on how to create a conversational contact form (the easy way).

Create Your Conversational Form Now

What Is a Conversational Form?

A conversational form is a type of web form that asks questions in an interactive environment. Questions in conversational forms appear only one at a time and feel like a real conversation. This helps to greatly improve user experience as compared to traditional forms. Conversational forms can reduce abandonment and boost conversion rates.

We’ll show you how you can build conversational forms in WordPress using WPForms, which is the best Typeform alternative.

How to Create a Conversational Contact Form

If you’re ready to set up a conversational contact form that your visitors will love, here are the steps.

Step 1: Generate a Simple Contact Form

The first thing you’ll need to do is install and activate the WPForms plugin. For more details, see this step by step guide on how to install a plugin in WordPress.

Now, you’ll want to open a basic template to get your form started.

Go to WPForms » Add New to create a new form. On the setup screen, name your form and then click on the Simple Contact Form template.

conversational contact form in wpforms

WPForms will now automatically generate a simple contact form for you.

basic form before enabling conversational contact form

Pretty cool, right? Let’s go ahead and customize this form.

Step 2: Customize Your Form

WPForms makes customizing your conversational contact form easy to do.

This form comes with the following fields in this order:

  • Name (First and Last)
  • Email
  • Paragraph Text (Labeled as Comment or Message)

You can add any field you’d like to your form by dragging the field from the left-hand panel onto the form on the right. For this example, we’ll add a Phone field so we can ask people for their number.

add field to form before enabling conversational contact form

Once you’ve added any fields you like, you’re ready to move on to your form settings.

Step 3: Configure Your Form Settings

To start, go to Settings » General.

general settings customizationHere you can configure the following:

  • Form Name — Change the name of your form here if you’d like.
  • Form Description — Give your form a description.
  • Submit Button Text — Customize the copy on the submit button.
  • Spam Prevention — Stop contact form spam with the anti-spam feature, hCaptcha, or Google reCAPTCHA. The anti-spam checkbox is automatically checked on all new forms.
  • AJAX Forms — Enable AJAX settings with no page reload.
  • GDPR Enhancements — You can disable the storing of entry information and user details, such as IP addresses and user agents, in an effort to comply with GDPR requirements. Check out our step-by-step instructions on how to add a GDPR agreement field to your simple contact form.

When you’re done, click Save.

Step 4: Enable Conversational Forms

Now’s the fun part — turning your form into a conversational form!

From the same settings page, click on Conversational Forms in the left-hand panel.

click on conversational forms

It will be greyed out if you haven’t activated the Conversational Forms addon yet. If you haven’t, you’ll see the option to activate it once you click on it. Click on Yes, Activate.

activate conversational forms

Once the addon has been activated, click on Yes, Save and Refresh.

save and refresh after conversational contact form addon is activated

Great job!

You’ve turned your simple contact form into a conversational contact form. But before you put it on your website, let’s finish setting it up so it works great.

Step 5: Configure Conversational Form Notifications

When you get an entry from your conversational contact form, you’ll probably want to know right away so you or your team can jump into action.

How can you do that? By setting up form notifications. They’re the perfect way to get an email whenever someone submits to your conversational contact form online.

To do this, click on Notifications in the left-hand panel so you can edit what emails are sent to who when a conversational contact form is submitted on your site.

click on notifications

If you use Smart Tags, you can also send a notification to the user when they fill this out, letting them know you received their submission and someone will follow up soon. This assures people their request has gone through.

For help with this step, check out our documentation on how to set up form notifications in WordPress.

And if you want to keep branding across your emails consistent, you can check out this guide on adding a custom header to your email template.

Custom Email Header

Note: Since file attachment can often hurt email deliverability, WPForms doesn’t attach files in emails. For example, if an email provider only allows a maximum of 10MB for the attachment but the user uploads a file size higher than 10MB, the email won’t be delivered. Instead, we send the file uploads via email as links.

Notification Email Links

And that’s how WPForms form notifications can be set up for your conversational contact form.

Step 6: Customize Your Form Confirmations

Form confirmations are messages that display to site visitors once they submit a conversational contact form on your website. They let people know that their request has gone through and offer you the chance to let them know what the next steps are.

WPForms has 3 confirmation types to choose from:

  1. Message — This is the default confirmation type in WPForms. When a site visitor submits a request, a simple message confirmation will appear letting them know their form was processed. Check out some great success messages to help boost user happiness.
  2. Show Page — This confirmation type will take site visitors to a specific web page on your site thanking them for submitting. For help doing this, check out our tutorial on redirecting customers to a thank you page. In addition, be sure to read our article on creating effective Thank You pages.
  3. Go to URL (Redirect) — This option is for when you want to send site visitors to a different website.

Let’s see how to set up a simple form confirmation in WPForms so you can customize the message site visitors will see when they fill out your form.

To start, click on the Confirmation tab in the Form Editor under Settings.

Next, select the type of confirmation you’d like to create. For this example, we’ll select Message.

form confirmations

Then, customize the confirmation message to your liking and click Save.

For help with other confirmation types, see our documentation on setting up form confirmations.

Step 7: Add Your Conversational Contact Form to Your Site

After you’ve created your form, you need to add it to your WordPress website. WPForms allows you to add your forms to many locations on your website, including your blog posts, pages, and even sidebar widgets.

Let’s take a look at the most common placement option: page/post embedding.

To begin, create a new page or post in WordPress, or go to the update settings on an existing one.

After that, click inside the first block (the blank area below your page title) and then type in WPForms in the search bar. You’ll see the WPForms icon almost immediately.
add conversational form to wordpress website

Now, click on the Add WPForms icon and click on the drop-down menu and select which form you just created. It’ll be automatically inserted on your page.

publish conversational contact form

Don’t forget to hit Publish or Update on your page to make the form live.

Now you have your conversational form set up, look at more ways to continue talking with your visitors. For example, you can check out our list of LiveChat solutions.

Next, Compare Top Form Builders for WordPress

If you’ve already read our Ninja Forms vs WPForms review, you’ll know that Ninja Forms doesn’t support conversational forms at all. But with WPForms, you can turn any form into a beautiful conversational form in seconds.

Create Your WordPress Form Now

Did you enjoy this guide? You may also be interested in our post open source alternatives to reduce SaaS bills too.

So what are you waiting for? Get started with the most powerful WordPress forms plugin today. WPForms Pro includes unlimited free conversational contact forms and offers a 14-day money-back guarantee.

If you enjoyed this post, make sure to follow us on Facebook and Twitter for more free WordPress tutorials.

Using WordPress and want to get WPForms for free?

Enter the URL to your WordPress website to install.

Comments

  1. I need to create a form. Formidable Forms loose their functionality when the form is large and they don’t have bulk edits. Gravity forms does have bulk editing but their repeater fields is terrible. I’m looking for a builder for large forms that I can create repeaters and multi-edit.

    1. Hi Joel- We don’t currently have the ability to allow front-end users to replicate fields or sets of fields, though this is on our feature request list to consider adding down the road.

      For now, the best alternative solution is to use conditional logic to display the right number of fields (or sets of fields). If you’d like to give this a shot, here’s what you’d need to do (it’s actually pretty easy, but can be confusing when you’re just getting started):

      1) Add a Dropdown field where each option is a number — include the full range of possible numbers of fields.

      2) Add the field(s) you want. Then click on each to open its Field Options screen and click on Smart Logic. Enable this, then add logic to make this field appear for every number available in the dropdown.

      Here’s a screenshot to demonstrate what the conditional logic would look like if your dropdown options are 1, 2, and 3: (screenshot) using the Single Line Text field as an example. The key is to make sure you use the Add new group button — which applies ‘OR’ logic.

      Why you need OR logic can get confusing, but if you’re curious here are more details.

      What you’ve just created is a field that will display with every single number that gets selected.

      3) Now duplicate this field (with the double paper icon shown here). On this copied field, go into the Conditional Logic section and remove the ‘If Dropdown is 1’ logic, like in this screenshot.

      This will mean that this field only appears if 2 or higher is selected from the dropdown.

      4) Continue this process for every other possible number (duplicate previous field, then remove the lowest number’s conditional logic).

      When you’re done, this will look super professional to the front-end user — it just takes a bit of doing for setup 🙂

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.

This form is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.