Skip to main content

Layout Options

The Layout Options panel in the Divi Form Builder module gives you control over how your form looks and behaves. From toggling the submit button to adding preload animations, this section helps you tailor the user experience.

Submit Button Settings​

Submit Button Setttings

Hide Submit Button​

Enable this option to permanently hide the submit button. This is useful in forms that don’t require submission, such as calculation-only forms or AI response previews.

  • Navigate to the form module settings.
  • Open the Layout Options section.
  • Set Hide Submit Button to Yes.

Submit Button Text​

Customize the label on the submit button to better suit your form's purpose. For example, you can replace “Submit” with “Calculate” or “Get Results”.

Disable Submit Button Until Required Fields Are Completed​

This setting ensures the form cannot be submitted until all required fields are filled out properly.

  • Enable Disable Submit Button Until All Required Fields Are Completed.

Make Submit Button Full Width​

Enable this to stretch the submit button across the full width of the form.

Form Loading Settings​

Hide Form Until Fully Loaded​

If your form is complex or loads slowly, you can hide it until all elements are ready.

  • Toggle Hide Form Until Loaded to Yes.

Add Preloader Animation​

Add a visual cue while the form loads by enabling a preloader. You can select from several styles:

  1. Divi VB Style: A visual builder style preloader.
  2. Three Lines Vertical: Three vertical lines that animate to indicate loading.
  3. Three Lines Horizontal: Three horizontal lines that animate to indicate loading.
  4. Three Dots Bouncing: Three dots that bounce in a sequence.
  5. Donut: A circular donut-style animation.
  6. Donut Multiple: Multiple donut animations.
  7. Ripple: A ripple effect animation.

Form Preloader Options

Post-Submission Behavior​

Scroll to Form After Submission​

Enable this setting to automatically scroll the page back to the top of the form after submission—helpful for long pages or when messages appear above the form.

  • Optionally, you can define a pixel offset to adjust the scroll position.

Scroll to Form after Submission

Summary​

These layout options enhance how your form appears and functions. They’re particularly useful for improving usability and adapting to specific form purposes like AI interactions or step-based calculations.