Creating and Configuring Custom Fields in the Web Builder

Overview

The Custom Field feature in the Web Builder allows users to create and manage reusable fields that can be added to various form components across the event website. By configuring display labels, field types, categories, validations, access rights, and translations, users can ensure consistent data collection and display.

This article explains how to create, configure, save, and verify custom fields using the Create Field option in the Web Builder.

Step-by-Step Approach

1. Access the Web Builder

• From the Event Dashboard, navigate to the Content module.
• Select the Pages submenu.

2. Click on the Create Field Button

• Click the Create Field button.
• The field creation panel opens.

3. Enter or Edit the Display Label

• Locate the Display Label field.
• Enter or edit the label as required.
• This label appears on forms as the field name.

4. Select Type from the Type Select Field

• Locate the Type dropdown.
• Select the appropriate field type (Text, Date, Select, Multi-select, URL, etc.).
• The selected type determines the field’s behavior.

5. Select or Add a New Field Category

• Locate the Field Category option.
• Select an existing category.

6. Enter or Edit the Tool Tip

• Locate the Tool Tip field.
• Enter or edit the tooltip text.
• This text provides guidance when users hover over the field.

7. Enter or Edit the Field Name

• Locate the Field Name field.
• Enter or edit a unique system name for the field.
• Follow the recommended naming conventions.

8. Select Component from the Component Select Field

• Locate the Component field.
• Select the component where the field will be used (Single Column Form, Two Column Form, Read Only Form, etc.).

9. Enter or Edit Placeholder Text

• Locate the Placeholder Text field.
• Enter or edit the placeholder for field types other than Select or Multi-select.
• This text appears inside the field as a hint.

10. Enter or Edit the Error Message

• Locate the Error Message field.
• Enter or edit the message shown when validation fails.

11. Configure Field Validations

• Click the Field Validation tab.
• Select and configure validation rules based on the field type.
• Set required limits, formats, or conditions.

12. Configure Field Rights

• Click the Field Rights tab.
• Select or unselect available permission options.
• Define who can view or edit the field.

13. Configure Field Translations

• Click the Translation tab.
• Select a language.
• Enter or edit the translated text for the field.

14. Save the Newly Created Field

• Review all field configurations.
• Click Save to create the field.

15. Verify the Created Field

• After saving, return to the field list.
• Confirm that the newly created field appears in the Field Component List.
• Verify that the field is available for use in supported forms.