How to use Contact Form 7 in different Builders?

Whenever you are creating a website using WordPress, you will have a lot of customizing options to improve the presentation of your WordPress site. It is always necessary for you to use all those amazing plugins that will help you enhance the functionality of your WordPress site. You can use multiple WordPress themes, free and premium for creating an amazing WordPress site.

However, there are few basic things that you will have to learn when you are expanding your website. Using WordPress, you can easily enhance your website and you can improve things for yourself. If you are looking to create a contact form, then you can easily use Contact Form 7 that will help you in the best way possible.

contact form 7

The contact page is one of the most important things that you need to focus on creating as a webmaster. There are lots of ways to use Contact Form 7 when you are creating contact page of your website. Here, we are going to share few easy ways to use Contact Form 7 on different page builders. It will become a lot easier for you to use Contact Form 7 on different famous page builders.

Use Contact Form 7 with Beaver Page Builder

If you are running your WordPress site with Beaver Page Builder, then you must know that it is very easy to use page builder and you can easily create multiple pages using it. After setting your theme and page builder, you can install Contact Form 7 plugin from the plugin directory of WordPress.

After installing the Contact Form 7 plugin, you can go to the Contact Tab of your WordPress dashboard and you will have to create a new form.

Creating contact form is easy. All you have to do is to add all the desired fields and once you have created a form, you will have to save it. You can then copy the shortcode which is generated by the plugin.

You can go to your Contact page that you have created. If you have not, then you can create a contact page and you will be able to see the option of opening a page builder.

After clicking page builder, you will be able to go to the front-end of the page. On the right side, you will be able to see various options and you will have to choose a basic module.

Then you can drag the text editor from the basic module to the area where you want to place that element.

You will be able to see an editor and you simply have to paste the shortcode to make it work.

You can save the editor and publish changes to have a contact form on the desired page.

Use Contact Form 7 with Elementor Page Builder

If you are using Elementor Page builder, then the process is not that different. When you are creating a contact page using Elementor Page builder, you will see an option for editing with Elementor. You will have to click that option.

Once you have opened a page builder, you will be able to see various elements and you will have to drag shortcode element and drop it onto the dotted lines.

Once you have dropped the shortcode element, you will be able to pass the shortcode that you previously copied and after pasting it, you just have to click save.

After pasting the shortcode and saving it, you will be able to see the contact form on the page that you have selected.

Use Contact Form 7 with SiteOrigin Page Builder

SiteOrigin is another great page builder that you can use for your website and it will provide you all the functionalities you need. You can get plenty of content elements that you can use with SiteOrigin page builder. When you are creating contact forms using Contact Form 7 with SiteOrigin page builder, then you will have to follow few basic steps. First of all, you can create a contact form, and then you will have to copy the shortcode generated by the plugin.

When you are creating a contact page, you should select the option of page builder from the upper right corner of the editor.

The page builder will open and you will have to choose the elements within a row and a column. After selecting ‘Add Row’, you will be able to create a single row.

After you have selected a single row option, you will have to click on ‘add widget’ option. After that, you will have to choose SiteOrigin editor.

After selecting the SiteOrigin editor, you will have to open the editor, and you will have to past the shortcode that you copied from Contact Form 7 plugin. After pasting the shortcode, you can click save.

After saving the changes, you can preview the page to see the changes.

This is how you will be able to create contact forms using Contact Form 7 with different page builders.

Leave a Reply

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