Using Form Capture with Gravity Forms

This article discusses additional steps required to use ClickDimensions Form Captures with Gravity Forms (plugin for WordPress) and assumes you are already familiar with the functionality of both Form Captures and Gravity Forms.

The process for setting up a Form Capture to use with an existing Gravity Form is mostly the same as setting up a Form Capture for any other third party form: a Form Capture needs to be created in Dynamics, Form Fields have to be associated with it, and your ClickDimensions tracking script needs to be added to the page hosting the form. The problem lies in the fact that a Gravity Form will not allow users to modify certain aspects of the HTML that are necessary for the Form Capture to work properly, such as the form action and field IDs, without a webhook add-on.

Because the Gravity Form script you see (and will modify) below does include the ClickDimensions tracking script so you should not be placing the regular tracking script separately on the page that houses your Gravity Form. If the Gravity Form script and the regular tracking script are both on the page, you may not see the form capture process as expected.

Note: Due to the nature of the script, we recommend using a single Gravity Form per page as having multiple forms on the same page may cause issues with form submissions. This also includes Gravity forms with multiple pages.

Gravity Forms Script

Begin by opening your Form Capture record and clicking the Gravity Forms button in the toolbar.

This will display a pop-up containing the script that should be added to the page hosting the Gravity Form alongside the tracking script. The script will automatically be modified to account for any Form Capture Fields associated with the Form Capture. The script will look like this by default:

NOTE: the URL analytics.clickdimensions.com in the Gravity Forms Integration script varies based on your Data Center. Be sure check the script in your own environment when setting up your Form Capture.

and will look something like this as Form Capture Fields are added:

NOTE: The Gravity Form script needs to be placed inside an HTML Block. If the script is placed inside Google Tag Manager, it will not work correctly. 

Update the Script to Match Your Website

For the Gravity Forms integration script to function properly after being added to your site, the value in the parentheses of the line:

cdAnalytics.setDomain('clickdimensions.com'); 

needs to be manually replaced with the domain of the website on which the script is being used and a corresponding Domain record must exist within your Dynamics environment.

For example, if the script is being placed on your website, mycompany.com, make sure you have a mycompany.com Domain record in Dynamics and update that line of the script to:

 cdAnalytics.setDomain('mycompany.com'); 

Update the script to enable Google reCAPTHCA v3 Support

For the Gravity Forms integration script to function when your form is configured to use Google reCPATCHAV3, the following parameter will need to be set as true. Default is false.

UseRecaptchaV3: true,

Update the Script to Match the Gravity Form

Once the script has been added to your page, manually remove the bold Form ID and Input ID placeholder text and surrounding brackets from the script and replace it with the corresponding values from the Gravity Form.

Example of a completed script with Form ID, Input ID and brackets replaced:

Where Can I Find the Gravity Form and Form Field IDs?

Open The Gravity Form you are working with in WordPress and click the Preview button.

While viewing the form preview, right click and choose Inspect Element. This will allow you to see the HTML for the Gravity Form.

Above the HTML panel, click the icon that looks like a mouse pointer over a square. This will allow you to mouse over elements of the Gravity Form and automatically highlight the relevant HTML. Use this method to highlight the whole form to find the Form ID, then highlight each individual field to find the Field IDs.

You are looking for the attributes labelled id. This is where you will see the Form ID:

and This is where you will see the Field IDs:

In this example, our script would look like this once we have filled in the Form ID and Field IDs:

NOTE: Not all fields in Gravity Forms use the field ID format 'input_x_y'; be sure to confirm the correct values in your form code before placing the field ID values into the Gravity Form integration script.

NOTE 2: Please make sure that all required fields are also set to required on the Form Capture Field record as well. This must match.

Once you have saved the changes to your page, you should be able to submit the Gravity Form and have it create Form Submissions and Posted Fields within Dynamics to track the submissions.