Add a reCAPTCHA Field to your Forms

INTRODUCTION

In order to avoid automated ‘bots’ falsely submitting   your forms, we have included a Google’s reCAPTCHA solution. reCAPTCHA provides an extra field on your forms to prove that the user filling out the form is an actual human being and not a machine or ‘bot’. Google does this by creating a checkbox field that a human must read and check.  NOTE: that configuring reCAPTCHA is a requirement for your adding the Recaptcha field to your forms.

Occasionally, Google will also add other tests such as displaying images for a human to identify. This protects your form and prevents malicious individuals collecting data or spamming your organization by randomly filling out forms. You probably have used the reCAPTCHA field and may be familiar with it because many internet sites use it.

Using ReCaptcha

The first step in using the reCAPTCHA field is by registering your site with Google and creating a ‘key’ that you will enter into your site configuration. This key is needed so that Google can add more security protocols to your site to ensure that your staff is not spammed with fake event registrations. To create your reCAPTCHA key, follow the following steps.

NOTE: You only need to configure reCAPTCHA once. If you have already configured reCAPTCHA  for event registration you do not need to do it again.

1. go to: https://www.google.com/recaptcha/admin#list (you will need a Google Account to create a reCAPTCHA code). 

   1. NOTE: you can register multiple sites under one Gmail account.

2. Provide a label (such as ‘My Library’s Key’), and choose “reCAPTCHA V2”. 

3. Provide all the different domains you will be using for your site, one per line. (for example, mylibrary.org). If you use any other domain names such as 'mylibrary.ploud.net', you will need to add that domain as well. 

   1. You do NOT need to add the 'http://' in front of the domain.

   2. if you add a domain, mylibrary.org then that entry will cover the 'www' and non-www entries for that domain. For example if someone goes to your site at http://mylibrary.org OR http://www.mylibrary.org, the entry 'mylibrary.org' in the domains reCAPTCHA field will cover both.

4. Finally, accept the terms of service and click “Register”
   
   

   At this point, you should see Site key and a Secret key fields. You may need to select the red keys drop-down arrow to show the keys.Copy these values and paste them somewhere you can get to them easily for the next steps.
5. Click on your login name to reveal you personal tools menu.
6. Go to your Site configurations -> Configure ReCaptcha. NOTE: you must be a site administrator to be able to see the Site configurations item in your personal Tools. Below is what the personal tools menu looks like in one of the Ploud themes.
7. While in the Recaptcha Setting Control Panel, enter the Site Key and the Secret key you got from the Google reCAPTCHA you set up earlier. Click Save to apply your settings to your site.

You will only need to enter your reCAPTCHA keys once for your website.

Now your ready to add the reCAPTCHA field to your forms as follows.

(For these instructions we will be using the Contact-Us form which is installed by default on all Ploud sites) 

1.  Locate your form folder and click the PlonFormGen folder icon
   
   
2.  Once you have selected to open the PloneFormGen folder icon the fields and form adapters that are contained in the form are listed.
   
   
3.  The ReCAPTCHA field should be the last field on the form.  It is advised to complete and test your form then add the ReCAPTCHA field at the end of the form development. It is easier to test and develop the form first rather than having to validate your submission with ReCAPTCHA each time you test.
   
   To add the ReCAPTCHA field select form the green edit bar Add New --> Captcha Field 
   
   
   
   
4. This will open the Add ReCAPTCHA field page. Enter the name of the field then click save.
   
   When you see this page and the ReCAPTCHA field displays without any errors you can be assured that the registration keys were entered correctly . You do not need to perform any action on this page.
   
   
   
5.  Return to the PloneFormGen folder and the ReCAPTHCA filed will now display at the bottom of the field list and is ready for testing.