If you are creating your website with WordPress, then you should know that you will have a lot of options. You can always select any WordPress free or premium theme for creating your website. However, if you are looking to make things easier for yourself and you are looking to manage your content in the best way possible, then you can always use different page builders out there. You should consider using the best page builder whether you are using a premium or a free theme on your website.
Creating a contact page is always necessary for every webmaster. If you want to create a catchy contact form on your contact page, then you should always consider using Contact Form 7 Plugin for your WordPress site. Here, we are going to explain how you can use Contact Form 7 plugin with various page builders. If you have no idea how you can do that, then you should go through the following steps to get the clear idea of using CF7 with different page builders out there.
Using Contact Form 7 with Beaver Page Builder
If you have selected Beaver page builder, then you should know that it is pretty easy to use. All you have to do is to select a theme and install Beaver page builder. After setting up your theme and page builder, you will have to install Contact Form 7 plugin on your WordPress site.
Once you have installed the Contact Form 7 Plugin, you will have to go to the Contact tab in your WordPress dashboard, and you will have to create a new form.
You can create your contact form by adding all the desired fields. Once you have created a form, you will have to save it, and you will have to copy the shortcode generated by the plugin.
After that, you will have to go to the pages where you can create a Contact page. When you are creating a page, you will be able to see the option for opening a page builder.
You will have to click that button, and it will take you to the front-end of the page. One the right side, you will see multiple options, and you will have to select the basic module.
You need to drag the text editor from basic module to the area where you want to place that element.
An editor will open, and you simply have to paste the shortcode of the contact form that you have copied before.
You can save the editor and publish changes. You will have a form on your desired page.
Using Contact Form 7 with Elementor Page Builder
When you are using Elementor page builder, the process of creating a contact form will be the same. When you are creating a contact page, you will see an option for editing with Elementor, you will have to click that particular option.
After opening the page builder, you will be able to see multiple elements; you will have to drag shortcode element and drop it into the dotted section.
After dropping the element, you will be able to paste the shortcode of the contact form that you have previously copied. After pasting the shortcode hit save.
After pasting the shortcode and saving the element on the page, you will be able to see the contact form on the page that you have created.
Using Contact Form with SiteOrigin Page Builder
SiteOrigin is another powerful page builder that most of the people are using on their WordPress sites. If you are looking for multiple options with plenty of content elements, then it can be one of the best page builders that you can use. When you are creating a contact form using Contact Form 7 plugin with this page builder, you will have to create a form, and you will have to copy the shortcode that you can place to a specific page.
When creating a contact page, you need to choose page builder option on the upper right corner of the visual editor.
The page builder will ask you to choose the right elements within a row or in a column. After selecting ‘Add row’ option, you need to create a single row.
After clicking a single row option, you have to click on ‘add widget’ option. After that, you will be asked to select multiple options, and you need to choose Siteorigin editor.
After adding the site origin editor element, you will have to open that editor, and you will have to paste the shortcode of the contact form that you copied earlier. After pasting the code hit save.
After saving the page, you will have to preview it so you can see the changes.
These are the simple ways to create a contact form on different page builders out there, and you can always create a custom contact form using Contact Form 7 plugin.