WiscWeb - Adding CAPTCHA to Gravity Forms

• What is CAPTCHA?
• Creating a reCAPTCHA Account
• Adding reCAPTCHA Keys to WiscWeb
• Including CAPTCHA in Gravity Forms
• Troubleshooting

What is CAPTCHA?

CAPTCHA is a simple test that allows the browser to distinguish between a human user of your form and machine input by a bot. Adding it to your web forms will allow you to restrict submissions by bots, which will cut down on the amount of spam emails that come in to your department.

Here's an example of reCAPTCHA, the form we encourage you to use with your WiscWeb forms:

Step 1: Creating a reCAPTCHA account

Note: You will not be able to complete this step unless you have a Google Cloud Platform account with the DoIT Cloud team. Please request that and wait until you have an account before proceeding.

1. While logged into your NetID account that your Google Cloud Platform account was requested with, navigate to the Google reCAPTCHA service page.
2. In the Label field, type in the domain for your site (Example: wiscweb.wisc.edu)
3. In the reCAPTCHA type list, choose Challenge V2 
4. Click the plus sign (+) to add your domain(s)
   1. If your site hasn't launched yet and is still publishing to a *.project.wiscweb.wisc.edu domain, make sure to add that domain and the your desired final production domain. 
5. Under Google Cloud Platform, choose your Google Cloud Platform account from the dropdown list.
6. Click Submit
7. You should be presented with two reCAPTCHA keys - save these for step 2.

Step 2: Adding reCAPTCHA keys to your WiscWeb project

In order to be able to add CAPTCHA to your WiscWeb forms, you will have to first adding the reCAPTCHA Site and Secret Keys to your Gravity Forms settings.

1. Copy the Site Key from your recently created reCAPTCHA account
   
   
2. Navigate to your WiscWeb Dashboard 
   
   
3. Click on Forms from the left navigation menu
   
   
4. Choose Settings
   
   
5. Choose reCAPTCHA
   
   
6. Locate the reCAPTCHA Settings fields
   
   
   
   
7. Paste in site key into the Site Key field
   
   
8. Go back to your other browser window and copy the Secret Key from your new reCAPTCHA account
   
   
9. Navigate to your WiscWeb browser window and paste the secret key into the Secret Key field in the reCAPTCHA Settings
   
   
10. Click the blue Save Settings button
    
    
11. Proceed to step 3

Step 3: Including CAPTCHA in a form

In order to include CAPTCHA in one of your forms, you will simply need to add this field to the form in your editing environment.

1. In WiscWeb, navigate to Forms by selecting it from the left navigation menu in the Dashboard
   
   
2. Choose the form to which you'd like to add CAPTCHA functionality
   
   
3. From the Editing environment, scroll down to where you'd like to add the CAPTCHA element (usually at the very bottom of the form).
   
   
4. From the menus on the right, open the accordion for Advanced Fields
   
   
   
   
5. Click and drag the CAPTCHA button and place it where you want in the form
   
   
   
   
6. If everything is set up correctly, your CAPTCHA field will show up as expected:
   
   
   
   
7. Make sure to click the blue Update button to save your changes to the form

Troubleshooting

• If you do not copy and paste the entire site or secret key into the Forms Settings, you will see an error. Make sure you are copying and pasting the entire key before you continue.
  
  
• If you do not save your changes in WiscWeb, the process will not work. Make sure to select the Save Settings button after pasting in your keys and make sure to select Update after adding the CAPTCHA button to your form.