How To Add A Contact Form With Elementor

By James LePage
 on November 29, 2020
Last modified on January 6th, 2022

How To Add A Contact Form With Elementor

By James LePage
 on November 29, 2020
Last modified on January 6th, 2022

The most important element on most websites is the contact form. Many websites are designed to convert visitors into leads, and the contact form is where this happens. Users browse through your website, checking out the services that you have to offer, the experience that your company brings to the table, the testimonials that previous customers have, and eventually end up on a contact form.  

graphical user interface

It is here where you want your visitor to enter their information, click the submit button, and transition from a visitor to a lead. You can then take the information that was submitted on this contact form, an attempt to convert the lead into a paying customer. 

If you are like most small business owners, you manage your own website, and it is probably built with Elementor and WordPress. There's a good reason why Elementor is one of the most popular page building plugins out there. It is incredibly simple to set up a website for your business, display what you have to offer online, and convert visitors into leads. 

If you're reading this article, you probably want to know how to add a contact form to Elementor. After all, you just built out a complete website using the Elementor page builder, and now need to add the most vital aspect of any conversion oriented website. 

Adding a contact form with Elementor is fairly simple, but there are a couple of ways to do this, and a couple of best practices to follow, ensuring that  you are generating the most leads possible. 

If you are an Elementor user, you're either using the free version or the pro version. This article will help you add a contact form to Elementor on either one of these pricing tiers. First, let's discuss how to add a contact form to Elementor free. 

graphical user interface, application, website

You have your choice from many contact form plugins. We recommend WP forms or WP fluent forms. Take your pick. Both of these plugins are freely available on the WordPress repository, and come with several features. WP forms is easy to use, and fluent forms comes with some advanced features. If you're looking for simplicity, go with WP forms, if you're looking for features, go with fluent forms. 

Install the plugin, and build your form. Both form plugins include a drag and drop builder similar to Elementor's. 

graphical user interface

Virtually every WordPress form builder plugin operates with Shortcodes. You create your form in the builder, and then you use the shortcode to insert it into your page. With Elementor, that is no different. Build out the form in your respective form builder plugin, then do exactly that in your Elementor page builder.  

The Elementor free version comes with a shortcode widget. Drag and drop the shortcode widget onto the page, paste in your form shortcode, and save the page. On the front end, your new contact form will show up on your Elementor website’s frontend.  

graphical user interface, application

If you are looking for something with more functionality, you're going to need to pay for it. We have two recommendations if you are looking for a paid form plugin. The first is Piotnet forms which is a one time payment. This is relatively advanced, and comes with a drag and drop builder interface that is almost identical to Elementor. You can easily style and build out forms in a front end interface. 

If you need enterprise level features an integrations with email marketing platforms, we definitely recommend taking a look at WS forms. This is a relatively new entry to the crowded WP forms plugin market, but because of that it comes with a ton of features at an affordable price for most businesses. 

Piotnet Forms review:

WSform Review:

If you are using Elementor pro, you have several new options. Elementor pro comes with a fully featured contact form builder, which you can use to create and insert a form directly from the builder. This is a good option if you need basic functionality. when a user submits content into the form, it is emailed directly to you. There are also additional integrations to third party services like MailChimp and other email marketing tools. 

A drawback is that you don't natively have access to a database of all entries in your WordPress website. However, that is easy to remedy as there is a free plugins that enables the database functionality for you. 

You can also follow the method above if you are looking to add a contact form to Elementor with a bit more power. 

We hope that this article helped you add a contact for to your Elementor – built website.

Subscribe & Share
If you liked this content, subscribe for our monthly roundup of WordPress news, website inspiration, exclusive deals and interesting articles.
Unsubscribe at any time. We do not spam and will never sell or share your email.
Notify of
Inline Feedbacks
View all comments
Article By
James LePage
James LePage is the founder of Isotropic, a WordPress education company and digital agency. He is also the founder of, a venture backed startup bringing AI to WordPress creators.
We're looking for new authors. Explore Isotropic Jobs.
linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram