Site icon Hip-Hop Website Design and Development

How to Configure Contact Forms Using Contact Form 7 Plugin?

configure contact form 7 WordPress

We are sure you’ll like the simple and user friendly way to configure WordPress Contact Form 7 plugin to add the required contact form to your site.

Are you thinking of adding a contact form to your WordPress website?

Each and every website certainly needs a contact form integrated so that the potential web visitors, clients and customers can easily get in touch with the website representatives and find the answers to their questions.

Having a contact form included in your website will make your workload more streamlined and faster. It will let you get the whole required information about your clients, including name, phone number, email and more.

Moreover, using contact form as the main connection portal between you and your client base is safer than providing email address to connect you.

This will save both your time and nerves you’ll spend on receiving, analyzing and sorting out tons of messages, including also spams.

If you run a WordPress powered website and want to bring contact form functionality to your site, the best way to do so is to start from choosing the right contact form plugin to rely on.

In this article, we offer you to use Contact Form 7 plugin as one of the best plugins available in WordPress library.

Do you need an intelligible tutorial about to install and configure WordPress Contact Form 7 plugin? Here we go!

Contact Form 7:

Contact Form 7 is by far one of the frequently downloaded and used contact form plugins. It’s a free plugin with lots of premium features and extendible nature. It means, that you are free to us add ons or extensions to make this plugin more powerful and sophisticated to meet your website needs.

Now, let’s dive straight into the process of installing and configuring Contact Form 7 properly. Although dealing with this plugin requires some technical and coding knowledge, we’ll try to keep things as simple and comprehensible as possible.

Start with uploading contact-form-7 folder to your WP plugins directory and activate it through WP Plugins menu. Once the plugin is installed and activated, let’s go to Contact, Contact Forms to configure WordPress Contact Form 7 plugin and manage the available contact forms there.

Find and click on Add New button. You will be asked to choose the language.

After choosing the relevant language, you will be transferred to a new contact form editor. The basic fields which are usually included in the contact form are already present.

However, if you want to have additional fields together with the basic ones already provided, you can add them by using the Form field buttons you can find in the opened editor. Click on one of the fields and a pop up will be displayed with Field type, Name, Default value and more.

You can choose the Field to be a required field, which means that the users will be obliged to fill in that field.

As for the name, it is already filled in by default.

As for the default value, you can choose to use the text as placeholder of the field.

Finally, click Insert Tag to add this field to your contact form. At this point, you may need to add a simple code like [url rul-7].

Just next to Form tab, you can find Mail to insert the basic details, like the email you want the forms to be sent to, subject, additional headers, etc.

There are relevant tags like [your-subject], [your-name] to be used when dealing with the fields of the form. Save your changes and pass on to Messages.

Here you can customize the messages which are send in certain situations, like when the message is successfully sent, the message was failed to send, date format error, etc.

Whenever you are finished with message customizations, go to Contact, Contact Forms to make sure that your newly created contact form is listed there.

In case you want to configure WordPress Contact Form 7 plugin and add reCaptcha to it, you can do that as well. For this you need to generate reCaptcha public and secret keys, visit

https://www.google.com/recaptcha/intro/invisible.html, click on Get RECAPTCHA button and enter your WP website details.

After the registration on this site, you need to integrate reCaptcha with Contact Form 7 plugin.

Now visit Contact, Integration and type Site Key and Secret Key. Add the keys you have already generated.

Continue with Contact, Contact forms, Your form and insert [recaptcha] code right before submit button.

Then go to Pages, Add New and paste [contact-form-7] code. Now you have reCaptcha embedded into your site contact form.

The next step is to proceed with the creation of a contact page. When you start to configure WordPress Contact Form 7 plugin, you can notice a remark to copy [contact-form-7] code and paste it into post, page or text widget content. Now copy this code since you are going to use it while creating a contact page.

Now go to WP Dashboard, Pages, Add New. Here you need to add the title like Contact Us and paste the shortcode you have already copied. Now you can publish the page!

There is one step remaining to complete so that your website visitors and users can see it. You need to locate it in the menu. Go to Appearance, Menus, select the header menu and add the page you have already created to this menu. Check the page and add it to the menu by clicking on Add to Menu.

Save menu and test your work. Check whether the contact form is present in your WP site’s menu. Click on that menu item and find the contact page. Fill in your name, email and message in the given fields and send. If you get a confirmation message upon submission, then congratulations! Your website contact form is running impeccably.

At last, if you don’t want your contact form to appear in header menu, but want to locate it in a footer, you can do it by the creation of new menu and adding the following code in functions.php:

add_action( 'init', 'register_footer_menu' ); // this registers your menu with WP
function register_footer_menu() {
if ( function_exists( 'register_nav_menu' ) ) {
register_nav_menu( 'footer-menu', 'Footer Menu' );
}
}

add_action('wp_footer', 'display_footer_menu', 1000, 0);
// display function for your menu:
function display_footer_menu() {
echo ( has_nav_menu( 'footer-menu' ) ? wp_nav_menu (
array (
'theme_location' => 'footer-menu',
'container_id' => 'footer-menu',
'container_class' => 'footer-menu'
)
).'' : '' );
}
Now go to Menus, The new menu you have created, Add Items and insert the needed pages in your menu. Find menu locations and check against Footer menu. Save your configurations and publish your contact form in the footer menu.

The post How to Configure Contact Forms Using Contact Form 7 Plugin? appeared first on SKT Themes.