Let’s Talk

We would love to hear from you. Want to know more about
our services or have any questions? Say Hi!

How to implement Google ReCAPTCHA Field in Sitecore form?

October 20, 2023
How to implement Google ReCAPTCHA Field in Sitecore form?
Mitesh Patel
Mitesh Patel
Technical Head

Nowadays, Re-captcha has become an essential prerequisite for the submission of online forms. However, the main problem for Sitecore is that it does not provide a reCAPTCHA field. To achieve this, we need to develop specific code for its implementation.

Using the custom form element, we will go through a step-by-step process to implement the Google ReCAPTCHA with Sitecore Forms. And will create a generic component that you can use for any other form as well.

For this, we need to make some changes in the Core DB and master DB.

The Core DB Changes
  1. Navigate to the location

    "/sitecore/client/Applications/FormsBuilder/Components/Layouts/PropertyGridForm/PageSettings/Common/Details" and create a duplicate of the "FieldName" item.

  2. Rename it to "PrivateKey". Now in this item update the “FormLabel” to “Private Key” and “BindingConfiguration” like the below screenshot

  3. Do the same steps for the other two items "PublicKey" and "ErrorMessage".

Now to create the Property Editor follow bellow steps.

  1. Navigate to the “/sitecore/client/Applications/FormsBuilder/Components/Layouts/PropertyGridForm/PageSettings/Settings”

  2. Duplicate the "SingleLineText", rename it to "GoogleRecapthca" and navigate to Detail section

  3. Add the newly created items in “ControlDefinitions”field like below screenshot

The Master DB changes :
  1. Go to the "/sitecore/templates/System/Forms/Fields" location and make a copy of the "Input" Item located there. Rename it to “Google Recaptcha”. also create the _StandardValues of it

  2. Include three fields named "Public Key," "Private Key," and "Error Message".

  3. Modify the “PrivateKey” and “PublicKey” values in the _StandardValues.


Now create below files in your project

  1. GoogleRecaptcha.cs

  2. Also create the new class called “CaptchaValidator.cs” like below,

    how-to-implement-google-recaptcha-field-in-sitecore-form-6 how-to-implement-google-recaptcha-field-in-sitecore-form-7 how-to-implement-google-recaptcha-field-in-sitecore-form-8
  3. Create the new view “GoogleRecaptcha.cshtml” and place it under the “Views\FormBuilder\FieldTemplates”


Now in Sitecore Navigate to path “/sitecore/system/Settings/Forms/Validations” and create a new validator “Captchavalidator”.


Create a new field “Google Recaptcha” at the “/sitecore/system/Settings/Forms/Field Types/Security” and update the red marked fields

how-to-implement-google-recaptcha-field-in-sitecore-form-11 how-to-implement-google-recaptcha-field-in-sitecore-form-12

Now let’s create the form


And select the “CaptchaValidator” in the “GoogleRecaptcha” field’s Validations.


Now Let’s test the field


And Done for Implementation of the Google ReCAPTCHA field in Sitecore Form.