Configuring Gravity Forms

6 steps to using Gravity Forms to create an enquiry form:

  • Activate the Gravity Forms plugin
  • Create a Confirmation page
  • Create your Form
  • Set up Notifications
  • Embed your Form
  • Test the Form

If you haven’t already, you’ll need to purchase Gravity Forms from gravityforms.com

Activate the Gravity Forms Plugin

Use Dashboard, Plugins to load and activate the Gravity Forms plugin.

The Referrer/Keywords plugin adds additional information to the email confirmations showing the keywords used by the visitor to find the site, and the pages they visited before filling out the enquiry form.

If you are using Campaign Monitor, activate the Gravity Forms Campaign Monitor Add-On plugin.

Likewise if you are using PayPal, activate the Gravity Forms PayPal Add-On plugin.

Create a Confirmation Page

After an enquiry has been sent, you should redirect the visitor to a confirmation (success) page. On that page you should provide guidance as to when a response can be expected, and possibly offer links to other sections of your website the visitor may be interested in.

Using a success page allows you to set up Goals in Google Analytics so you can track successful form completions, or to track Conversions in Google AdWords.

Set up your success page as a standard WordPress page.

Create your Form

Use Dashboard, Forms, New Form to create a new form.

Form Properties

Edit the form Properties to give it a meaningful name and description. You have the option of displaying the name and the description when you embed your form.

Form Properties

Form Properties

Fields

Add fields to your form by clicking on the field types shown on the right hand side. Click on the Edit button to edit the fields to change their Field Label, tick the box if they are Required (mandatory), and apply other advanced settings.

Gravity Forms Field Types

Gravity Forms Field Types

Field Types:

  • Single Line Text and Paragraph Text: these are the basic single line and multi line fields
  • Dropdown and Multiple Choice: lets the visitor choose one option from a set of options (drop down list or radio buttons for multiple choice)
  • Checkbox: lets the visitor tick the box to choose one or more options from a set of options
  • Number: makes sure a number is entered, you can also set minimum/maximum values and define a length
  • Name: collects a name in Standard format (first last name), but also Simple (one field) or Extended (title, first, last, suffix)
  • Date: allows you to set a date format, and also show a default or custom icon for the calendar picker
  • Time: allows entry of HH:MM and am/pm
  • Phone: using the International format allows any format, or you can use the US/Canadian domestic format.
  • Address: allows you to switch on/off different parts of the address, and set a default Country (if displayed).

Conditional Fields

You can set up some fields to be conditional on other fields. For example, you might create a Multiple Choice field for How Did You Hear About Us, with the options including ‘Other’. You can then create a Single Line field called ‘More Information on how your found us’ that is displayed on condition that How Did You Hear About Us has a value of Other. To set up a conditional rule, you would use the Advanced tab for the Other field and tick the Enable Conditional Logic checkbox to set up the rule.

Confirmation

Edit the form Confirmation panel and configure your success page to be displayed for the Confirmation Message.

Confirmation Setup

Confirmation Setup

Set up Notifications

By default Gravity Forms will record entries in a database but won’t email the details anywhere unless you set up a notification.

Set up Notifications using Dashboard, Forms, Edit Form, hover over the form you want to set up notifications for and click the Notifications link.

Notifications Quick Link

Notifications Quick Link

Configure the notification options:

  • Set the From email address to use the email provided by the form entry. Note for Google Apps users: be careful about setting the From address to the same account name the email is being sent to – when Google Apps receives an email from the account email address, it automatically archives it, which could mean the email never gets seen.
  • You can include specific fields in the subject line, and use the Insert All Fields option to display all form fields in the body of the email.
Gravity Forms Notifications

Gravity Forms Notifications

Embed your Form

Insert in a Page – use the WordPress editor to insert a form. The Gravity Forms button is available in the editor toolbar in both Visual and HTML view.

Add Gravity Form Add Gravity Form Visual

To include a form in your sidebar, use Dashboard, Appearance, Widgets and add a Form widget.
Add Gravity Form Sidebar Widget

Test the Form

Test the form to make sure an enquiry is sent and received.

Advanced Layout Options – CSS Ready Classes

Read this article for more details: CSS Ready Classes in Gravity Forms

Laying out Fields in Two Columns

To lay out fields in two columns (left half and right half):

  • edit the field you want in the left column
  • go to the Advanced tab
  • enter gf_left_half in the CSS Class Name
  • repeat for the right hand field using gf_right_half as the CSS Class Name

Laying out Radio Buttons or Checkboxes on a single line

  • as above, but enter gf_list_inline in the CSS Class Name

Anti Spam – Captcha and Maths Test

To reduce the number of spam enquiries received via forms, you can add a Captcha field (one of the standard Gravity Forms field types). This displays a set of garbled letters for the visitor to decode.

Alternatively, if you don’t like the Captcha fields, you can set up a simple maths test question (which still seems to stop most bots). Create a number field with a field label of ‘What is 2+3?’. Make it a Required field and set the Range of valid entries to min 5 and max 5. Add a short message in the Description field to explain this if required, for example “Please type the answer to this short math question and help us avoid spam.”

See also: Configuring Gravity Forms with the PayPal Extension

Automate your WooCommerce store with Zapier

Automatically send your WooCommerce order, customer, or subscription data to 1500+ cloud services.

Built by OM4.

Other WooCommerce Extensions by OM4

After The Order

WooCommerce Order Management plugin that helps make everyone on your team an order management expert.

e-Path Gateway

Collect credit details securely online and process using your existing bank merchant account offline.

Enter your details below to receive our latest WooCommerce articles via email.

It's a great way for WooCommerce store owners and WooCommerce developers to stay informed about everything WooCommerce related!