Would you like to add a WordPress form to your website using Elementor? You can easily use the WPForms widget in Elementor to add forms and edit them to get them looking the way you want. Even better, you can do it all right from within the Elementor page builder.

In this article, we’ll show you how to add WPForms to an Elementor page.

1. Embedding Your Form
2. Configuring Display Options
3. Publishing Your Form

1. Embedding Your Form

Before you get started, make sure you’ve installed and activated the WPForms plugin.

First, you’ll need to open up the page or post where you’d like to embed your form.

If you don’t see the Elementor builder when you first open the page or post editor, click the blue Edit with Elementor button at the top of the screen.

Once you’ve opened the Elementor builder, look to the left sidebar. In the Basic widgets section, you should see a widget labeled WPForms.

Go ahead and drag the WPForms widget onto the widget area in the right-hand pane.

Now that you’ve added the WPForms widget to your page or post, you can choose between adding an existing form or creating a brand new form.

Adding an Existing Form

If you’d like to add a form that you’ve already created, then click the dropdown inside the WPForms widget. You’ll see all the forms you’ve created. Go ahead and select the form you want to add to your page.

Elementor will show you a live preview of your form as it will appear on your website.

If you need to make changes to the form, click the Edit the selected form link in the left-hand pane.

The form builder will open in a popup window so you can make changes to your form.

When you’re done editing, click Save, then click the X icon at the top-right to close the builder.

You’ll instantly see any field changes you made in the Elementor builder.

Creating a New Form

If you don’t have any forms yet, then you can create a new form without ever closing the Elementor builder. When you’re ready to do this, go ahead and click the pink Create a Form button.

After clicking this button, the WPForms builder will pop up so you can get started creating your form.

You can click Blank Form to create a new form from scratch, or click on the name of a template to customize it.

For example, to quickly make a contact form, click Simple Contact Form to open the template.

If you need help building your form, take a look at this guide on how to create your first form.

When you’re done building your form, click the Save button at the top-right of the WPForms builder, then click the X icon to close the builder.

Now you’ll see your new form in the Elementor builder. If you need to make more changes, just click the Edit the selected form link in the left-hand pane.

2. Configuring Display Options

To show the for title or description on the page, click to expand the Display Options panel.

You can also change the way the form block looks on your page in the Advanced tab of Elementor’s builder. To learn how to use the settings here, see the Elementor documentation on the Advanced tab.

3. Publishing Your Form

Before going live with your form, it’s a good idea to test it out and make sure it works the way you expect.

To do this, work through our guide on how to properly test your WordPress forms before launching.

When you’re ready to publish your form, click the green Publish or Update button at the bottom of the Elementor page builder.

That’s it! Now you know how to embed WPForms in Elementor.

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.