From collecting contact information to filling out an assessment for a whitepaper, forms are an important part of the experience that your customer will have with your website. We install a plugin called Gravity Forms on a lot of our websites in order to create contact forms, quizzes and even longer assessments. Personally, I love it and think it is a useful tool for clients to learn if they need to build a form. If you don’t have it installed on your website, feel free to check it out. And if you have gravity forms installed, feel free to follow this guide to create a simple form.

1. Navigate to the “Forms” on the sidebar. You’ll see a screen that prompts you to “create a new form” or you can also “Add New” right up by the “Forms” page title.

Step-1

When you click that, enter in a form title and (optionally) a form description. I’m going to name mine: “Contact Form.” Hit “Create form” and it will redirect you to the screen where you will build your form.

Step-2

2. Congrats! You’ve now created your form — now all you have to do is add parts (called “fields”) together. This is the fun part. In order to build a basic contact form we want to collect a first and last name, phone number, email address and short message where your potential customer or client can contact you.

3. Let’s start by adding the full name. If you look at the right side of your screen you will have standard and advanced options. Standard options will house the more basic fields. Advanced options will allow you to easily add popular fields such as “Name” and “Email” without having to make them out of the standard options. We want to add a name field to our form so go ahead and drag that button to our empty form.

Step-3

4. Our next two fields of our form can both be added from the advanced fields section. Drag and drop “Phone” and “Email” underneath the Name field. Once you’re finished, we’re going to want to make sure all three of these fields are “required.” You don’t want a potential customer to fill out a form without their name or phone number. Click on the Name field and it will expand to be a much bigger box. Look at the very bottom of the box and you’ll find a check box with “Required” next to it. Make sure that is checked on all the fields you want to require your customers to fill out.

Step-4

5. Now that you’ve made sure your fields are required, you need to add the last section of the form. Choose “Paragraph Text” from the standard fields. This field allows your customer to enter in a longer message but is not required for them to submit the form. Once you are finished, click the blue, “Update Form” button on the right side.

 

Step-5

6. Your form is officially complete! We need to make sure you get a notification e-mail with all of the information that your potential client just filled out. Navigate to form settings, notifications. you will see that there is a standard notification form. Click on it to edit it.

Step-7

7. You’ll want to edit the “Send to Email” field with whatever e-mail address you’d like your form notifications to be sent to. I chose my work e-mail “sara@roundpeg2020.wpengine.com”. Make sure to save your change. You are almost ready to put your form on a page in your website!

step-8

8. Add your form to the page. Whether you want to add your form to an existing page or create a new one, the process is the same. There is an add form button at the top of each text module that allows you to choose the form, and options for displaying the form title and description. It will create a shortcode that looks a bit like what I have below. Go ahead and publish or update your page, and you should have your final working form.

Add_form

9.  When you save your page you will see your final contact form. Depending on if you checked the box “Show my form title” and “Show my form description” you may have a little more or less information surrounding your form. Feel free to go back and edit your form at any point – it will be updated in your page.

Gravity-forms-tutorial

That’s it! There are many more advanced ways to make a form, but these are the basics. Feel free to check out the many features gravity forms offers, and happy form building!


RP_FREE_RESOURCES_Footer