Skip to main content

Adding and Customizing the Select Dropdown Field in Divi Form Builder

The Select Dropdown Field in the Divi Form Builder module allows users to select from a number of dropdown options. Each dropdown field is assigned specific data for selecting various options. This field can also be mapped to an ACF (Advanced Custom Fields) select field. Follow these steps to add and customize the Select Dropdown 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 Select Dropdown 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 Select Dropdown field from the Type dropdown menu.

Select Dropdown Field

Step 3: Customize Select Dropdown Field

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

Customize Select Dropdown 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 select based on a mapped field.
    1. Populate Options from Linked Post Only: Enable this option to display only the choices associated with the logged-in user
    2. Exclude Auto-Detected Options: Exclude certain options from being auto-detected.
  3. Enable Select Placeholder: Choose whether to include a placeholder in the select field.
    1. Placeholder Text: Enter the text to be displayed as the select placeholder.
  4. Is This Field for Calculation: Enable if the select field is used for calculations.
    1. Calculation Values for Options: Add values for each option to be used in calculations.
  5. Required Field: Make the select field mandatory for users to select at least one option.
  6. 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.
  7. Populate Options from Linked Post Only: If you are populating the select field with options from an ACF Post Object, enable this option to display only the choices associated with the logged-in user.

Additional Tips

By following these steps, you can effectively add and customize the Select Dropdown 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.