In Umbraco Forms, reCAPTCHA V3 comes out of the box.
reCAPTCHA v3 allows you to verify if an interaction is legitimate without any user interaction.
Follow these steps to enable reCAPTCHA V3 in Umbraco Forms:
Go to the Forms section in the backoffice.
Find the form that should have ReCAPTCHA v3 enabled.
Add a new question and select ReCAPTCHA v3 with Score as its answer type.
Make sure the field is set as Mandatory.
Configure ReCAPTCHA settings in the appSettings.json
file to include public and private keys:
You can create your keys by logging into your reCAPTCHA account.
The File Upload field allows the users to upload a file along with the Form on your website.
In this article, you will find details about the configuration options you have for the File Upload field.
You can choose to specify which files you want to allow the user to upload, when accessing the Form.
To allow only specific files:
Select the specific File Types the user should be able to upload.
Click Submit.
We recommend selecting only specified files, to limit malicious code to be uploaded, whenever the user is submitting the Form.
If the list of predefined file types does not include a specific file type, you can add additional ones.
To add new file type:
Type a file extension name in the User defined allowed file types field.
Click +.
Click Submit.
The file upload field type will verify the file contents using the registered set of IFileStreamSecurityValidator
instances.
To read more about this feature, see Server-side file validation in the CMS documentation.
Umbraco Forms comes with a bunch of default Field Types also known as Answer Types. You can choose from different field types when adding new fields to your Forms.
By default, the following Field Types are available:
Short Answer: A textbox allows up to 250 characters.
Long Answer: A bigger text field that allows multiline text and more than 250 characters.
Date: Displays a picker that allows the user to select a date.
Checkbox: Displays a single checkbox that can be checked or not.
File Upload: Allows user to select and upload a local file.
Password: Allows to type a password. The input is not visible when typing.
Multiple Choice: Displays a list of items with a checkbox for each item where the user can select multiple options.
Data Consent: A field for the purpose of asking for data consent. By default, this field is added to all new Forms.
Dropdown: Displays a list of items in a drop down box where the user can select a single option.
Single Choice: Displays a list of items with a radio button for each item where the user can select a single option.
Title and Description: Displays a read-only title and description for a set of form fields.
Rich Text: Displays read-only formatted text that can be used to provide additional information and links within a form.
Hidden: A hidden field allows developers to include data that cannot be seen or modified by users when a Form is submitted.
Recaptcha V2: The field displays a single checkbox for the user to select in order to validate the Form.
Recaptcha V3 with Score: This field returns a score for each request without user interaction. The score is based on user interactions with the site and enables you to take an appropriate action for your site based on the score.
The date picker uses a front-end library called to display a UI to pick dates.
Pikaday date picker can be localized based on the page the Form is rendered on.
The date picker displays the picked date in the required locale. Using JavaScript, a hidden field is updated with a standard date format to send to the server for storing record submissions. This avoids the locale mixing up the dates.
To achieve localized date, a Razor partial view is included at /Views/Partials/Forms/Themes/default/DatePicker.cshtml
.
The DatePicker.cshtml includes the moment-with-locales.min.js
library to help with the date locale formatting and the appropriate changes to Pikaday to support the locales. If you wish to use a different DatePicker component, edit the DatePicker.cshtml file as per your needs.
In Umbraco Forms, reCAPTCHA V2 comes out of the box to help you to protect your site from spam, malicious people, and so on.
Follow these steps to enable reCAPTCHA V2 in Umbraco Forms:
Go to the Forms section in the backoffice.
Find the form that should have ReCAPTCHA v2 enabled.
Add a new question and select ReCAPTCHA v2 as its answer type.
Make sure the field is set as Mandatory.
Configure ReCAPTCHA settings in the appSettings.json
file to include public and private keys:
The Date picker has to control the number of years shown in the picker and the date format.
You can create your keys by logging into your .