Skip to main content

Adding and Customizing the Checkbox Field in Divi Form Builder

The Checkbox Field in the Divi Form Builder module allows users to select from a number of checkboxes, each assigned to specific data. This field can also be mapped to an ACF (Advanced Custom Fields) checkbox field. Follow these steps to add and customize the Checkbox Field for your forms.

Video

Step 1: Add Form Field

  1. Navigate to the page with your form and open the Form Builder module.
  2. Click on the Add New Field button to start adding a new form field.

Add Form Field

Step 2: Select Checkbox Field

  1. Enter a descriptive Field Title for the field that users will see.
  2. Enter a Admin Title for administrative purposes to help identify the field.
  3. Assign a unique Field ID to the field for data handling.
  4. Select Checkboxes field from the Type dropdown menu.

Checkboxes Field

Step 3: Customize Checkbox Field

In additional to the styling features in the Design Tab, Divi Form Builder offers customization options for the Checkbox Field HERE.

Customize Checkbox Field

Field Options:

  1. Add Form Builder Prefix to Field: Disable this option to directly input the field ID and Name. Only disable this option for specific cases, such as when using the form with Google Tag Manager.
  2. Auto Detect from Mapped Field: Enable this option to automatically populate checkboxes based on a mapped field.
  3. Only Populate Selected Fields: Choose to populate only selected fields.
  4. Exclude Auto-Detected Options: Exclude certain options from being auto-detected.
  5. Options: Manually add your own checkbox options
  6. Add Images to Options: Add images to each checkbox option for a more visual selection.
    1. Radio/Image Checkbox Options:
      1. Image Options: Customize image options for the checkboxes.
      2. Show Radiobox for Image Options: Display a radio button along with image options.
      3. Image Options Label Position: Set the position of the labels for image options.
  7. Is This Field for Calculation: Enable if the checkbox field is used for calculations.
    1. Calculation Values for Options: Add values for each option to be used in calculations.
  8. Required Field: Make the checkbox field mandatory for users to select at least one option.
  9. Go to Next Step when change Select or Radio/Checkbox options: In a multi-step form, you typically need to press "Next" to proceed to the next step. However, if you enable the X feature, the form will automatically progress to the next step once the user selects an option, eliminating the need for an additional "Next" click.

Additional Tips

By following these steps, you can effectively add and customize the Checkbox Field in Divi Form Builder, ensuring it meets the needs of your form and provides a seamless user experience. Utilize the various customization options to make your forms both functional and visually appealing.