Skip to main content

Adding and Customizing the File Upload Field in Divi Form Builder

The File Upload Field in the Divi Form Builder module allows users to upload files to the WordPress Media section of your website. This field supports multiple file uploads and offers several customization options to enhance user experience..

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 File Upload 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 File Upload Field field from the Type dropdown menu.

Select File Upload Field

Step 3: Customize File Upload Field​

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

Customize File Upload 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. Max Upload File Counts: Limit the maximum number of files that can be uploaded.
  3. Max Number of Files Exceed Error: Customize the error message when the file count exceeds the limit.
  4. Max Upload File Size: Set the maximum file size for uploads.
  5. Max Upload File Size Error: Customize the error message when the file size exceeds the limit.
  6. Accepted File Types: Specify the types of files that can be uploaded (e.g., .pdf, .doc, .jpg).
  7. Accepted File Types Error: Customize the error message when an unsupported file type is uploaded.
  8. Upload Error Hide Delay (Milliseconds): Set the duration for how long the error message should be displayed.
  9. If on Edit Form - Remove File from Media Library: Enable the option to remove the file from the media library on the Edit Form.
  10. If on Edit Form - Remove File Confirm Message: Customize the confirmation message when removing a file from the Edit form.
  11. Required: Make the file upload field mandatory for form submission.

Additional Tips​

By following these steps, you can effectively add and customize the File Upload Field in Divi Form Builder. Utilize the various customization options to ensure the field meets your specific requirements and provides a seamless user experience. This setup allows users to easily upload files, enhancing the functionality of your forms.

Last updated on