Building a Contact Form with Divi Form Builder
Creating a contact form with the Divi Form Builder is a straightforward process that allows you to capture essential information from your website visitors. Follow these steps to build an effective contact form on your Divi WordPress site.
Video
Step 1: Add The Form Module
- Open the page where you want to add the contact form.
- Click on the '+' icon to add a new module and the
Form Module
from the list of options.
Step 2: Define Form Settings
- Add a descriptive
Form Title
for your contact form. - Assign a unique
Form ID
to the form to ensure it is easily identifiable. - Select
Contact Form
from the Form Type option. - Customize the text of the
Submit Button
(e.g., "Send Message").
Step 3: Add Form Fields
- Click on the
Add New Field
button to start adding fields to your form. - Configure Each Field:
- Add a descriptive
Field Title
andAdmin Title
for your contact form. - Ensure that each form field has a unique
Field ID
for proper data handling. - Choose from various field types such as Email, Number, Date, Input, etc.
- Add a descriptive
For more detailed information on our Field Types
, click HERE.
Step 4: Customize Contact Form
Divi Form Builder offers extensive customization options for both the entire form and individual form fields.
A Few Features
For more detailed information on our features, click HERE.
- Form-Wide options include:
- Customize the
appearance
of the entire form, including colors, fonts, and borders. - Configure the
email
settings to ensure form submissions are sent to the correct email address. - Implement
spam
protection measures such as reCAPTCHA to prevent unwanted submissions. - Set up
redirection
rules to take users to a specific page after form submission. - Enable
saving form entries
to your database, making them accessible for later review.
- Customize the
- Field-Specific options include:
- Customize the
appearance
of individual fields, including font size, color, and background. - Apply
conditional
logic to show or hide fields based on user input, enhancing the form's interactivity and relevance.
- Customize the
Additional Tips
By following these steps, you can create a highly functional and aesthetically pleasing contact form using Divi Form Builder. Whether you need a simple form for basic inquiries or a more complex setup with conditional logic and spam protection, Divi Form Builder provides the tools you need to customize and optimize your contact forms.