Author 诗语

Third Party Resources

Community Provided Add-OnsGravity Wiz (website)Gravity Perks (plugin)Gravity Flow (plugin)

Community Provided Add-Ons
We have created a library of third party add-ons that various developers have provided to work with Gravity Forms. Gravity Forms cannot guarantee or endorse these this party solutions, but we can certainly point you in their direction as the perfect solution to your problem may only be a search away!
Gravity Forms third party add-ons library.
A few of our community add-ons are actually offered by our very own team members (though these are not provided, guaranteed or supported by Gravity Forms in any way, but are listed here as a helpful sign post for our users)…
Gravity Wiz (website)
Created by one of the rocketgenius staff, Dave Smith, Gravity Wiz has tips, tricks and code snippets that will help add new features to Gravity Forms.
Check out GravityWiz.com for more information.
Gravity Perks (plugin)
Gravity Wiz also provides a paid service called Gravity Perks, a plugin and support package that gives you some useful features including:

Conditional Pricing (for dynamic product pricing)
Unique ID (for generating unique IDs)
Submission Preview (for providing a confirmation before submission)
Multi-page Form Navigation (for navigating more quickly between form pages)
Limit Choices (for providing the concept of inventory for your choices)
Copy Cat (for copying from one field to another)
And many more!

Check out Gravity Perks for more information.
Gravity Flow (plugin)
Another plugin by one of rocketgenius』 staff, Steve Henty. Gravity Flow allows you to automate your business processes. You can monitor, optimize & secure your workflow management with zero custom code.
Check out GravityFlow.io for more information.

Time Field CSS Selectors

HoursContainerInput FieldSub-LabelMinutesContainerInput FieldSub-LabelAM/PMContainerSelector

Hours
Container
Contains the hours input field and sub-label

example: time – hours container (div) – applies to all forms
body .gform_wrapper .gform_body .gform_fields .gfield .gfield_time_hour {border: 1px solid red}

example: time – hours container (div) – applies just to form ID #1
body #gform_wrapper_1 .gform_body .gform_fields .gfield .gfield_time_hour {border: 1px solid red}

example: time – hours container (div) – applies just to specific container (based on the unique parent element ID – replace 「XX_X」 with your actual element ID)
body .gform_wrapper .gform_body .gform_fields #field_XX_X.gfield .gfield_time_hour {border: 1px solid red}

Input Field

example: time – hours input field (input) – applies to all forms
body .gform_wrapper .gform_body .gform_fields .gfield .gfield_time_hour input {border: 1px solid red}

example: time – hours input field (input) – applies just to form ID #1
body #gform_wrapper_1 .gform_body .gform_fields .gfield .gfield_time_hour input {border: 1px solid red}

example: time – hours input field (input) – applies just to specific form field (based on the unique parent element ID – replace 「XX_X」 with your actual element ID)
body .gform_wrapper .gform_body .gform_fields #field_XX_X.gfield .gfield_time_hour input {border: 1px solid red}

Sub-Label

example: time – hours sub-label (label) – applies to all forms
body .gform_wrapper .gform_body .gform_fields .gfield .gfield_time_hour label {color: red}

example: time – hours sub-label (label) – applies just to form ID #1
body #gform_wrapper_1 .gform_body .gform_fields .gfield .gfield_time_hour label {color: red}

example: time – hours sub-label (label) – applies just to specific sub-label (based on the unique parent element ID – replace 「XX_X」 with your actual element ID)
body .gform_wrapper .gform_body .gform_fields #field_XX_X.gfield .gfield_time_hour label {color: red}

Minutes
Container
Contains the minutes input field and sub-label

example: time – minutes container (div) – applies to all forms
body .gform_wrapper .gform_body .gform_fields .gfield .gfield_time_minute {border: 1px solid red}

example: time – minutes container (div) – applies just to form ID #1
body #gform_wrapper_1 .gform_body .gform_fields .gfield .gfield_time_minute {border: 1px solid red}

example: time – minutes container (div) – applies just to specific container (based on the unique parent element ID – replace 「XX_X」 with your actual element ID)
body .gform_wrapper .gform_body .gform_fields #field_XX_X.gfield .gfield_time_minute {border: 1px solid red}

Input Field

example: time – minutes input field (input) – applies to all forms
body .gform_wrapper .gform_body .gform_fields .gfield .gfield_time_minute input {border: 1px solid red}

example: time – minutes input field (input) – applies just to form ID #1
body #gform_wrapper_1 .gform_body .gform_fields .gfield .gfield_time_minute input {border: 1px solid red}

example: tim – minutes input field (input) – applies just to specific form field (based on the unique parent element ID – replace 「XX_X」 with your actual element ID)
body .gform_wrapper .gform_body .gform_fields #field_XX_X.gfield .gfield_time_minute input {border: 1px solid red}

Sub-Label

example: time – minutes sub-label (label) – applies to all forms
body .gform_wrapper .gform_body .gform_fields .gfield .gfield_time_minute label {color: red}

example: time – minutes sub-label (label) – applies just to form ID #1
body #gform_wrapper_1 .gform_body .gform_fields .gfield .gfield_time_minute label {color: red}

example: time – minutes sub-label (label) – applies just to specific sub-label (based on the unique parent element ID – replace 「XX_X」 with your actual element ID)
body .gform_wrapper .gform_body .gform_fields #field_XX_X.gfield .gfield_time_minute label {color: red}

AM/PM
Container
Contains the minutes input field and sub-label

example: time – AM/PM container (div) – applies to all forms
body .gform_wrapper .gform_body .gform_fields .gfield .gfield_time_ampm {border: 1px solid red}

example: time – AM/PM container (div) – applies just to form ID #1
body #gform_wrapper_1 .gform_body .gform_fields .gfield .gfield_time_ampm {border: 1px solid red}

example: time – AM/PM container (div) – applies just to specific container (based on the unique parent element ID – replace 「XX_X」 with your actual element ID)
body .gform_wrapper .gform_body .gform_fields #field_XX_X.gfield .gfield_time_ampm {border: 1px solid red}

Selector

example: time – AM/PM selector (select) – applies to all forms
body .gform_wrapper .gform_body .gform_fields .gfield .gfield_time_ampm select {border: 1px solid red}

example: time – AM/PM selector (select) – applies just to form ID #1
body #gform_wrapper_1 .gform_body .gform_fields .gfield .gfield_time_ampm select {border: 1px solid red}

example: time – AM/PM selector (select) – applies just to specific drop-down field (based on the unique parent element ID – replace 「XX_X」 with your actual element ID)
body .gform_wrapper .gform_body .gform_fields #field_XX_X.gfield .gfield_time_ampm select {border: 1px solid red}

Time

SummaryCommon SettingsGeneral SettingsAppearance SettingsMerge TagsUsageModifiers

Summary

The Time field allows users to submit a time as hours and minutes. This field automatically validates that the information entered was formatted correctly. It is available under the Advanced Fields section within the form editor.

Time field as displayed in the Field Library

Time field as displayed in the Form Editor.

Common Settings

This field uses only common field settings for the Advanced settings. For a description of each of the common field settings, refer to this article. Below you will find description of specialty settings that are particular to this field.

General Settings

SettingDescriptionTime FormatSelect the format you would like to use for the time field. Available options are 12 hour (i.e. 8:30 pm) and 24 hour (i.e. 20:30).Custom Sub-LabelEnter values in this setting to override the sub-label for each field.

Appearance Settings

SettingDescriptionSub-Label PlacementSimilar to the Description Placement option, but instead changes the sub-label placement.

Merge Tags

For more information on the use of merge tags, refer to these articles.

Usage

{Field Name:2}

Notes:

The first of these merge tag parameters is optional and is simply the field name for easier identification.The second parameter defines the field ID within the form. In the example above, it would be field ID 2.

Modifiers

This field does not have any modifiers.

Total Field CSS Selectors

ContainerTotal Price

Container
example: total field container (div) – applies to all forms
body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container_total {border: 1px solid red;}
example: total field container (div) – applies just to form ID #1
body #gform_wrapper_1 .gform_body .gform_fields .gfield .ginput_container_total {border: 1px solid red;}
example: total field container (div) – applies just to specific container (based on the unique parent element ID – replace 「XX_X」 with your actual element ID)
body #gform_wrapper_1 .gform_body .gform_fields #field_XX_X.gfield .ginput_container_total {border: 1px solid red;}
Total Price
example: total price (span) – applies to all forms
body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container_total .ginput_total {color: red;}
example: total price (span) – applies just to form ID #1
body #gform_wrapper_1 .gform_body .gform_fields .gfield .ginput_container_total .ginput_total {color: red;}
example: total price (span) – applies just to specific container (based on the unique parent element ID – replace 「XX_X」 with your actual element ID)
body #gform_wrapper_1 .gform_body .gform_fields #field_XX_X.gfield .ginput_container_total .ginput_total {color: red;}

Total

SummaryCommon SettingsMerge TagsUsageModifiers

Summary

The Total field specifies where the order total should be displayed in the form. As the user selects products and options, the total will automatically update. It is available under the Pricing Fields section within the form editor.

Total field as displayed in the Field Library

Total field as displayed in the Form Editor.

Common Settings

This field uses only common field settings for the General, Appearance, and Advanced settings. For a description of each of the common field settings, refer to this article. Below you will find description of specialty settings that are particular to this field.

Merge Tags

For more information on the use of merge tags, refer to these articles.

Usage

{Field Name:2:modifier}

Modifiers

ModifierDescription:priceUsed to denote that the amount displayed by the merge tag should be formatted as currency.

Translating the Datepicker

This work around is only necessary for Gravity Forms versions 2.4 and prior. The datepicker translations are part of the standard translation package in Gravity Forms 2.5.
The Datepicker used by the Date field is powered by the jQuery UI Datepicker script which is bundled with WordPress, as such it won』t be translated by the translation files included with Gravity Forms.
To translate the Datepicker you will need to download the translation file for your desired language from the jQuery UI GitHub repository. Save the file to the /js/ directory of your active theme.
Next you would add the following code snippet to your theme functions.php file, updating datepicker-your-lang with the actual name of the translation file you downloaded.
1234567add_action( 'gform_enqueue_scripts', 'add_datepicker_regional', 11 );function add_datepicker_regional() {    if ( wp_script_is( 'gform_datepicker_init' ) ) {        wp_enqueue_script( 'datepicker-regional', get_stylesheet_directory_uri() . '/js/datepicker-your-lang.js', array( 'gform_datepicker_init' ), false, true );        remove_action( 'wp_enqueue_scripts', 'wp_localize_jquery_ui_datepicker', 1000 );    }}

Setting Up the PayPal Pro Add-On

Pre-RequisitesSetup

DEPRECATION NOTICE: The PayPal Pro Add-On is no longer being updated by Gravity Forms, and is no longer available for download. It uses a legacy PayPal API no longer being actively developed by PayPal, and is not compatible with modern PayPal accounts. It has been replaced in our plug-in library by other PayPal add-ons.
Pre-Requisites

SSL certificate installed and configured
Download and install the add-on
A PayPal Pro account
A form with a Pricing field and a Credit Card field

The Gravity Forms PayPal Pro Add-On requires the use of the Pricing Fields in Gravity Forms v1.6.3+ and will not work with older versions of Gravity Forms.
Because of the secure nature of capturing credit card information, you will also be required to purchase and install an SSL certificate on your web site. You will also need to configure your WordPress site to work properly with SSL.
Contact your web host if you need assistance purchasing and configuring an SSL certificate.
If you need assistance configuring your WordPress site to work with SSL, we recommend the WordPress HTTPS (SSL) Plugin which you can find here: http://wordpress.org/extend/plugins/wordpress-https/
Setup

Log into your WordPress admin dashboard.
On the left side navigation menu, hover over Forms and click on Settings.
From this page, click the PayPal Pro tab.
Select the API for PayPal Pro integration. Live uses the live PayPal Pro API for real transactions, and Sandbox uses PayPal』s developer sandbox account for test transactions. Please Note: Using PayPal』s Sandbox API requires a PayPal developer account which you can sign up for here: https://developer.paypal.com/.
Enter the API Username, API Password, and API Signature for your PayPal Pro account.
Verify IPN has been enabled in your PayPal Pro account in order to enable Recurring Payments.
Click Update Settings. If you』ve entered your account information correctly, you will be notified by green check marks beside each box. If you do not see green check marks, please double check this information and try again.

Once you have entered your API information, you』re ready to begin creating a feed for the PayPal Pro Add-On.

Setting Up the Postmark Add-On

Pre-RequisitesSetup

Pre-Requisites

Download and install the add-on
A Postmark account

Setup
Before you can start configuring your notifications to go through Postmark, you first need to do a quick bit of setup so that Gravity Forms is able to communicate with your Postmark account.

Log into your WordPress admin dashboard.
On the left side navigation menu, hover over Forms and click on Settings.
From this page, click the Postmark tab.
Enter your Account API Token and Server API Token. This is obtained from Postmark. If you are unsure of how to obtain your API key, take a look at our article on obtaining your Postmark API tokens.
Click Update Settings. If you』ve entered your account information correctly, you will be notified by green check marks beside each box. If you do not see green check marks, please double check this information and try again.

Once you have entered your API tokens, you』re ready to begin sending form notifications using Postmark.

Setting up the reCAPTCHA Add-On

IntroductionSettingsSetup ProcessesGetting Your KeysAdding Your KeysSetting a threshold

Introduction

The official Gravity Forms reCAPTCHA Add-On brings Google』s reCAPTCHA v3 technology as an addition to your anti-spam toolbox. This article describes how to configure the basic settings for use.

Settings

For a full list of all the reCAPTCHA Add-On settings, refer to this guide.

Setup Processes

This guide covers the following setup processes for both v2 and v3 reCAPTCHA types.

Getting your keys (v2 or v3).Adding your keys (v2 or v3).Setting a score threshold (v3 only).

Getting Your Keys

Google reCAPTCHA keys need to be registered for each site you wish to use the service on. Follow these steps for both v2 and v3 reCAPTCHA services.

Go to Google reCAPTCHA admin. If necessary, login with your Google developer account. Click + to generate a key pair for your site. Make sure to generate the correct type of key, as v2 and v3 keys are not interchangeable.Make note of the two keys you have generated.

Adding Your Keys

To validate the communication between your site and the Google service, you will need to tell Gravity Forms this unique key pair.

Navigate to Forms → Settings → reCAPTCHA.Enter the site key and secret key you previously recorded under the v2 or v3 settings section. For v3 keys, you should immediately see a green check mark for both keys, meaning they have been validated.For v2 keys, choose the version of reCAPTCHA v2 you wish to use, Checkbox or Invisible. This is a site wide setting, and cannot be varied form to form. Note that Checkbox keys are not valid for use with invisible reCAPTCHA.For v2 keys, you will need to click the 「I am not a robot」 reCAPTCHA checkbox in order to validate the keys.

Setting a threshold

This process is applicable only to reCAPTCHA v3.

The threshold determines what Gravity Forms will do with form entries based on the reCAPTCHA v3 score they receive. Entries with a reCAPTCHA score less than or equal to this value will be classified as spam. For more information, refer to this Google article.

By default, the threshold is set to 0.5. If you wish to modify this, follow this procedure:

Navigate to Forms → Settings → reCAPTCHA.Enter the threshold value you wish. The higher the score (from 0 to 1) returned from Google, the more likely it reflects a good interaction. This threshold value will affect new entries received from that point on.

Setting Up the SendGrid Add-On

Pre-RequisitesSetup

Pre-Requisites

Download and install the add-on
A SendGrid account

Setup
Before you can begin setting up your notifications, you』ll need do a quick bit of setup so that Gravity Forms can authenticate with your SendGrid account. To set up the SendGrid Add-On, perform the following steps:

Log into your WordPress admin dashboard.
On the left side navigation menu, hover over Forms and click on Settings.
From this page, click the SendGrid tab.
Enter your SendGrid API Key. If you need help getting your API key, you can follow our article on obtaining your SendGrid API key.
Click Update Settings. If you』ve entered your account information correctly, you will be notified by a green check mark beside the box. If you do not see a green check mark, please double check this information and try again.

Once you have entered your API Key, you』re ready to begin sending form notifications using SendGrid.