How to Add WPForms to a Divi Page

Would you like to add a WordPress form to your website using Divi? You can easily use the WPForms module in Divi to add forms and edit them to get them looking the way you want.

In this tutorial, we’ll show you how to add WPForms to a page with the Divi page builder.

Before getting started, you’ll first need to make sure that WPForms is installed and activated on your WordPress site.

Before using the Divi builder, you’ll need to create a new form if you haven’t already.

Once you’ve created your form, open up the page you’d like to embed your form on. If this is a new page, you’ll see a Use Divi Builder option. Go ahead and click that option to be redirected to Divi’s builder.

Use Divi Builder

Once you open the builder, you’ll be prompted to choose to either build a page from scratch, choose from a pre-made layout, or to clone an existing page. For our example, we’ll build our page from scratch by clicking the Start Building button.

Choose Divi Layout

This will open up a blank page for you to begin building on. By default, a popup should appear asking you which type of row layout you’d like to add to the page. For our example, we’ll choose the first option, which will allow our module to be the only object in the row.

Insert Single Row Divi

Once the row has been created, you’ll be prompted to insert a module. Search for WPForms in the search box and select the module that appears.

Once the module has been added, this will open up the module settings, where you can add a form to the page with the Select Form dropdown. Additionally, you can also show the form’s title and description by toggling those options within the module settings.

When you’re ready, go ahead and select your form from the dropdown.

WPForms Module Settings

This will automatically embed your form into the page, and you can save your progress by clicking the green checkmark button.

Save Form in Divi

If you’d like, you can also edit the form’s appearance using the module’s Design or Advanced tabs.

Note: If you’d like more details on how to style your form using Divi, be sure to check out their guide on Design settings & Advanced module settings for more information.

Once you’ve got your form embedded and ready to go, you’ll need to make sure to either save or publish your page. To do this, first click on the three dots at the bottom of the page builder to open up additional settings.

Then, you can choose to either save a draft of your work, or publish it to the front end of your site. Go ahead and choose the option that makes most sense for you.

That’s it! Now you know how to embed WPForms with the Divi Builder.

Now you’re ready to add more features to your form. If you’d like to show or hide fields based on your visitor’s choices, take a look at our easy guide to using smart conditional logic.