facebook

How can we help you today?

< All Topics
Print

Gravity Forms

Gravity Forms Version 2.2.3 – July 11, 2017

Overview

The Gravity Forms plugin lets you create and maintain advanced forms.

Help Icons

Throughout the Gravity Forms interface, especially next to form field labels, you will notice a circular questions mark icon.  This icon will display helpful information related to what it appears next to.  For example, icons that appear after a field setting will instruct you on how to use the setting in the back-end as well as what the setting does on the front-end.

Form Builder

The Form Builder allows you to quickly and easily build and design forms using various fields.  Click the fields on the right to add them to the form on the left.  Alternatively, you can drag and drop fields from the right to the left.  Once a field has been added to the form you can click on it to customize and configure its settings further.

Field Toolbar

Clicking on a field will toggle the settings for that field, the available settings will depend on the field.  The Field Toolbar is located at the top of each field.  The field toolbar is blue and has buttons on the right side of the toolbar for duplicating and removing the current field.

Global Field Settings

All fields share some of the same settings.

General

  • Field Label – This is the field label the user will see when filling out the form.
  • Description – If enabled, this will be displayed to the user and provide direction on how the field should be filled out or selected.
  • Input Mask – If enabled, this will provide a visual guide allowing users to more easily enter data in a specific format (e.g. phone number).
  • Maximum Characters – The allowable number of characters the field will accept.
  • Required – If enabled, prevents the form from being submitted if field is not filled out or selected.
  • No Duplicates – If enabled, forces user input to be unique values or values that do not currently exist in the entry database for that field already.

Appearance

  • Placeholder – Gives the user a hint at the expected value or format for the field.
  • Description Placement – Select whether the field description appears above or below the field.
  • Custom Validation Message – This message will be displayed if there is an error with this field when the user submits the form, this overrides the default error validation for the field.
  • Custom CSS Class – Enter CSS class names that can be used to override the default styles for the field.
  • Enable enhanced user interfaces – Enables search capabilities to Drop Down field and a more user-friendly interface for Multi-select fields.
  • Field Size – The width of the field.

Advanced

  • Admin Field Label – Overrides the field label when displayed in the Gravity Forms administration area.
  • Default Value – Allows you to pre-populate the value of the field.
  • Visibility – Select who can view the field.
  • Allow field to be populated dynamically – If enabled, allows data to be passed to the form which then can be used to pre-populate the field dynamically.
  • Enable Conditional Logic – If enabled, allows you to create rules to dynamically display or hide the field based on the values from another field.

Standard Fields

Standard Fields provide basic form functionality.

Single Line Text

Allows a user to enter a single line of text (e.g. username, password, ID, etc.).

  • Advanced > Enable Password Input – Converts the field into a password field which will mask user input.

Paragraph Text

Allows a user to enter multiple lines of text.

  • Advanced > Use the Rich Text Editor – Adds a text editor to the field so users can easily add and format text in the field.

Drop Down

Allows a user to select one option from a list.

  • General > Choices – Add choices to the drop down field. Use the + and buttons on the right to add or remove choices.  Tick the radio buttons on the left side of a choice to check it by default.

Multi Select

Allows a user to select one or more options from a list.

  • General > Choices – Add choices to the multi select field. Use the + and buttons on the right to add or remove choices.  Tick the radio buttons on the left side of a choice to check it by default.

Number

Allows a user to enter a numeric value.

  • General > Number Format – Select the format of numbers allowed in the number field.
  • General > Range – The minimum and maximum values allowed in the number field.
  • General > Enable Calculation – Allows the value of this field to be dynamically calculated.

Checkboxes

Allows a user to select one or more options from a list.

  • General > Choices – Add choices as check box fields. Use the + and buttons on the right to add or remove choices.  Tick the radio buttons on the left side of a choice to check it by default.

Radio Buttons

Allows a user to select one option from a list.

  • General > Choices – Add choices as radio button fields. Use the + and buttons on the right to add or remove choices.  Tick the radio buttons on the left side of a choice to check it by default.
  • General > Enable “other” choice – Add a text field as the final choice of the radio button field. This allows the user to enter a choice that has not been pre-defined.

Hidden

This field is used to store information that should not be visible to the user but can be processed and stored when the form is submitted.

HTML

Allows you to enter a block of HTML.

  • General > Disable default margins – When enabled, margin are added to properly align the HMTL content with the other form fields.

Section (break)

Adds a section break to the form.

Page (break)

Adds a page break to the form, this allows for multi-page forms.   Three fields are generated when adding a page break field: the Start Paging field, the Page Break field and the End Paging field.

The Start Paging field will appear at the top of your form and is used to specify general options:

  • General > Progress Indicator – Select which type of visual progress indicator you want displayed.
  • General > Style – Select what style you want to use for the progress bar.
  • General > Page Names – The name of each page in your form.
  • General > Display completed progress bar on confirmation – Check if you want the progress bar to display the confirmation text.

The Page Break field will determine where one page end and another begins.

  • General > Next Button – Use text or an image as the next button.
  • General > Previous Button – Use text or an image as the previous button.

The End Paging field will appear at the bottom of your form.

  • General > Previous Button – Use text or an image as the previous button.

Advanced Fields

Advanced Fields are for specific uses, they enable advanced formatting of commonly used fields like Name, Email and Address.

Name

Allows a user to enter their name, each part entered in different field.

  • General > Name Fields – Select the fields you want to use and use the Custom Sub-Label to change the label of the field.

Date

Allows a user to enter a date using a date picker.

  • General > Date Input Type – Select the type of input you want to use for the date field.
  • General > Date Format – Select the format you want to use for the date input.

Time

Allows a user to enter a time as hours and minutes.

  • General > Time Format – Select the format you want to use for the time input.
  • General > Field Custom Sub-Label – Change the sub-level for hours and minutes.

Phone

Allows a user to enter a phone number.

  • General > Phone Format – Select the format you want to use for the phone number input.

Address

Allows a user to enter an address.

  • General > Address Type – Select the type of address.
  • General > Address Fields – Select the fields you want to use and use the Custom Sub-Label to change the label of the field.
  • General > Default Country/State/Province – Select the country/state/province you want selected by default.

Website

Allows a user to enter a website.

Email

Allows a user to enter an email address.

  • General > Enable Email Confirmation – If enabled adds a Confirm Email

File Upload

Allows a user to upload a file.

  • General > Allowed file extensions – A list of allowed file extensions, each separated with a comma.
  • General > Enable Multi-File Upload – If enabled, allows multiple files to uploaded.
  • General > Maximum File Size – The maximum file size (mb) allowed for each file.

Captcha

A security field a user must complete to prove they are a human and not a robot.  This field will only work if the reCaptcha settings have been entered.

List

Allows the user to add or remove rows of information per field.

  • General > Enable multiple columns – If enabled, allows multiple columns of data.
  • General > Maximum Rows – The maximum number of rows a user can add.
  • Advanced > Add Icon URL – A URL of a custom image to replace the default “add item” icon.
  • Advanced > Delete Icon URL – A URL of a custom image to replace the default “delete item” icon.

Post Fields

Post Fields are used in tandem to generate post data.  Some settings are consistent among multiple fields, these settings are only mentioned once.

Title

Allows a user to submit data that is used to populate the Title of title field of a post.

  • General > Post Status – Select the post status that will be used for the post.
  • General > Default Post Author – Select the author that will be used for the post.
  • General > Used logged in user as author – If enabled, the post author will be set to the logged in user submitting the form.
  • General > Post Category – Select the category that will be used for the post.
  • General > Content Template – If enabled, allows you to format and insert merge tags into the post title.

Body

Allows a user to submit data that is used to populate the Content field of a post.

  • Advanced > Use the Rich Text Editor – If enabled, allows the use of the rich text editor in the body field.

Excerpt

Allows a user to submit data that is used to populate the Excerpt field of a post.

Tags

Allows a user to submit data that is used to populate the Tags module of a post.

  • General > Field Type – Select how tags are shown and selected by the user.

Category

Allows a user to submit data that is used to populate the Categories module of a post.

  • General > Field Type – Select how categories are shown and selected by the user.
  • General > Category – Select which categories are displayed to the user.

Post Image

Allows a user to upload an image that is added to the Media Library and Gallery for the post.

  • General > Image Metadata – Select which image metadata fields to be displayed along with the uploaded image.
  • General > Featured Image – If enabled, sets the image as the post’s Featured Image.

Custom Field

Allows a user to submit data that is used to populate a custom field value of a post.

  • General > Field Type – Select how custom fields are shown and selected by the user.
  • General > Custom Field Name – Select the custom field name from existing custom fields or enter a new custom field.

Pricing Fields

Pricing Fields allow products and services to be purchased through a form.

Product

Allows a user to select a product(s), sometimes allows quantity and price to be defined by user.

  • General > Field Type – Select what type of product field to use. This field will determine if other fields are shown/hidden.

Quantity

Allows a user to enter a quantity that can be applied to a specific product filed.

  • General > Product Field Mapping – Product field the quantity is mapped to.

Option

Allows a user to select an option(s) for a specific product.

  • General > Product Field Mapping – Product field the option(s) is mapped to.

Shipping

Displays the shipping amount or allows the user to select a specific shipping method.

Total

Displays the total cost.

Credit Card

Allows a user to enter their credit card information which will be processed on submission of the form.

Form Settings

The Form Settings screen allows you to configure various general settings related to the current form you are editing.

Form Basics

  • Form Title – Set the title of the form, you can select to show or hide this title on the front-end when adding a form to a page.
  • Form Description – Set the description of the form, you can select to show or hide this description on the front-end when adding a form to a page.

Form Layout

  • Label Placement – Select to show the field labels above or below each field. Each field has its own label placement setting that can override this setting.
  • Description Placement – Select to show the description above or below each field. Each field has its own description placement setting that can override this setting.
  • Sub-Label Placement – Select to show the sub-label above or below each field. Each field has its own description placement setting that can override this setting.
  • CSS Class Name – Enter a CSS class name that can be used to override the default styles of the form.

Form Button

  • Input Type – Select which input type you would like to use. Button Text will display the button as text.  Button Image will display the button as an image.
  • Button Conditional Logic – Create rules to dynamically show or hide the submit button based on values in the form.

Save and Continue

Allows the user to save and continue filling out the form at a later time.

Restrictions

  • Limit Number of Entries – Limit the number of entries allowed for the form. The form becomes inactive when this number is reached.
  • Schedule Form – Schedule when the form is active, including start and end dates.
  • Require User to be Logged In – User must be logged in to view the form.

Form Options

  • Anti-Spam Honeypot – Enable the honey-pot spam protection technique.
  • Animated Transitions – Enable a sliding animation when displaying or hiding conditional logic fields.

Confirmations

Confirmations are a way to communicate with the user after they have submitted a form.  Generally they are used to let the user know the form has been submitted and that someone will contact them at some point regarding the form.  Confirmations can be one of three types:

  • Text – Displays a message to the user right on the website after the form is submitted. Adding a text confirmation is done using the visual editor.
  • Page – Redirects the user to a specific page when the form is submitted.
  • Redirect – Redirect the user to a specific URL. This is similar to redirecting to a page but you can manually enter the Redirect URL which allows you to link to an external site if you want to.

Notifications

Notifications are used to contact the administrator of a form, notifying them the form has been submitted by a user and often contains the data the user entered into the form.  While confirmations usually redirect to a page or URL, notifications are generated emails.

  • Name – Enter a name for the notification.
  • Sent To – Enter the email address(s) you want the notification email sent to. This can be manually entered or generated using a field in the form.
  • From Name – Enter the name you want the notification email sent from.
  • From Email – Enter the email address you want the notification email sent from. This email should contain the domain of the website to prevent delivery issues.
  • Reply To – Enter the email address you want to be used as the reply to address.
  • BCC – Enter the email address(s) you want to receive a BCC of the notification email.
  • Subject – Enter the subject of the notification email.
  • Message – Enter the message of the notification email. The default value of this field is {all_fields} which will display all the fields of the form.
  • Auto-Formatting – If enabled, auto-formatting will insert paragraph breaks automatically.
  • Conditional Logic – If enabled, allows the notification to be sent based on specific rules.

Merge Tags

The Merge Tag icon/button can be found throughout the Gravity Forms interface, mainly next to fields that can be dynamically populated from other data in the form.  Further information on merge tags can be found in the official Gravity Forms documentation.  Merge tags are not exclusive to notifications, they can be found throughout the Gravity Forms interface.

Entries

The Entries screen allows you to view all entries generated by form submissions.  Entries can also be sorted and modified via this screen.

Adding a Form to a Page, Post or Custom Post Type

Forms can be added to any type of content that supports shortcode.

  1. Access the page, post or custom post type you want to add the form to.
  2. Place your cursor in the content where you want your form to appear.
  3. Click the Add Form button next to the Add Media button.
  4. Select the form you want to add using the dropdown menu.
  5. Select or deselect the options to display the form title and description.
  6. Select the Enable Ajax option if you want for submission to happen without a page refresh. Most the time you will want to keep this option disabled.
  7. Click the Insert Form

 

Frequently Asked Questions

None yet.

External Resources

Gravity Forms Plugin Homepage

Gravity Forms Official Documentation

Next Gravity Forms
Table of Contents