Build A Contact Form
Follow the steps below to build a contact form using Divi Form Builder. Please Click HERE for detailed descriptions of each setting.
1.) Add .Form Module.
Start off by adding the .Form module to the page of your choice.
Edit the main settings on the Content tab.
2.) Content Main Options.
Edit the main options by adding a title, ID, form type and submit button.
3.) Content Email Options.
If you would like to send the form via email, then customize this section. If you do not need the form to be emailed then move on. Please note that you will need an SMTP to ensure that the form is emailed.
4.) Content Notices Options.
Where would you like to display form notices? Select a position.
5.) Content Redirects Options.
If you would like the page to redirect to another URL after a failed or successful submission, please enable the button and add a URL.
6.) Content Extra Options.
In the extra section, you have the option to save the entries to your WordPress database, use Bloom and Select2.
7.) Spam Protection Options.
Enable the simple Divi spam protection.
After completing the main settings of the content tab, you will need to add and customize form fields that relate to a contact form. Examples of field types that you will want to use in your contact form include the Input, Text Area, Email, Checkbox, Radio, Image Upload, File Upload, Select Dropdown and Date.
1.) Field Options.
Give your form field a title, ID, type of field, etc.
2.) Layout Options.
What kind of layout do you want for the field? Enter a placeholder for the field, select full width, half-width and more.
3.) Mapping Options.
Mapping options are only for forms that are designed to create login and registration forms, pages, posts, and custom posts. Ignore this section for contact forms.
4.) Conditional Logic.
Conditional logic enables you to create a dynamic form. For example, you can set it so that only certain fields show when others are activated. Please visit this LINK and read through the document to learn how to use conditional logic.
View your new contact form from the front end and remember to use the Design tab for extra style.
