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
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
toYes
.
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
toYes
.
Add Preloader Animation
Add a visual cue while the form loads by enabling a preloader. You can select from several styles:
- Divi VB Style: A visual builder style preloader.
- Three Lines Vertical: Three vertical lines that animate to indicate loading.
- Three Lines Horizontal: Three horizontal lines that animate to indicate loading.
- Three Dots Bouncing: Three dots that bounce in a sequence.
- Donut: A circular donut-style animation.
- Donut Multiple: Multiple donut animations.
- Ripple: A ripple effect animation.
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.
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.