How To Add Contact Form 7 Form In Elementor Without Any Plugin

Disclosure: Some of the links in this post are affiliate links. This means, if you click on the link and purchase the product, I will receive a commission at no additional cost to you. Don’t worry, I only recommend products or services that I have personally used and believe will add value to my readers.

Want to add a form created with Contact Form 7 in Elementor without using any additional plugins?

Here are the steps to add a Contact Form 7 form in Elementor:

  1. Create the form with Contact Form 7 that you want to place on the page created with Elementor.
  2. Copy the shortcode of the Contact Form 7 form.
  3. Edit the page with Elementor on which you want to place the form created with Contact Form 7.
  4. Drag-and-drop the Shortcode widget on the page.
  5. Paste the Contact Form 7 shortcode in the Shortcode widget settings.
  6. Save your changes.

Let’s take a detailed look at each of these steps now.

STEP 1: Create The Contact Form 7 Form

First, create the form using the Contact Form 7 plugin that you want to place on a page using Elementor.

Once the form is created, go to Contact > Contact Forms page and copy the shortcode of that form.

Copy Contact Form 7 form shortcode


STEP 2: Add The Form To The Page Using Elementor

Once you have copied the shortcode of the form, edit the page with Elementor on which you want to place this form.

Once Elementor is active, scroll down and drag-and-drop the Shortcode widget on the page.

Drag-and-drop the Shortcode widget

Now, paste the form shortcode in the “Enter your shortcode” field on the left-side widget settings panel.

Add shortcode in Elementor

The Contact Form 7 form should now display on the page. Save your changes.

And that’s it!

That is how you can add a form created with Contact Form 7 plugin to a page using Elementor.

The form will look basic. So here’s how to style Contact Form 7.

Related Further Reading:

Video Tutorial

Download Website Builders’ Toolbox


What Next?

Creating and adding a Contact Form 7 form to a page using Elementor is straightforward.

You just have to use the correct widget.

If you found this tutorial helpful, then please share it with your friends who might find it useful.

About The Author

Leave a Comment

Your email address will not be published. Required fields are marked *