How to create a working contact page in WordPress

Learn how to create a contact page with Contact Form 7

Create Contact Page
Image Source: Skitterphoto – Pixabay.com / License: CC0 Public Domain

We usually have included styling for the popular Contact Form 7 plugin in our WordPress themes. The Contact Form 7 plugin can be used to create working contact forms for your WordPress website and setting up contact pages with Contact Form 7 is quite simple, because all you need to do is install the plugin, create a new page in your WordPress dashboard named Contact (or anything else) and then paste the code snippet of the contact form into your just newly created page. That’s it very briefly. For a more detailed step-by-step guide, please keep reading this article.

Step 1 – Download and install the Contact Form 7 plugin

The Contact Form 7 plugin is very helpful in order to create contact forms as it provides a fully functional contact form which is ready for use out of the box and which can be easily customized according to your personal needs and requirements. To install the plugin, first go to Plugins => Add New in your WordPress dashbaord and search for the Contact Form 7 plugin.

Contact Form 7

Once you’ve found the plugin, click the Install Now button and the Contact Form 7 plugin will be installed automatically on your WordPress website. After you’ve activated the plugin, you will see a new item called Contact, showing an envelope icon, in your WordPress dashboard telling you that the Contact Form 7 plugin has been installed successfully.

Step 2 – Create new page for your contact form

To use the Contact Form 7 plugin correctly, it’s recommended to create a new page where you can display your contact form. If you already have created a suitable page, then you can skip this step and proceed with the next one. Otherwise, please navigate to Pages => Add New in your WordPress dashboard and create a new page with the name Contact, Contact Us or anything else.

Display custom sidebar for contact page

When you are using one of our WordPress themes, you’ll usually have a custom page template for your contact page included. Please select Contact as page template for your contact page under Page Attributes and your contact page will have its own sidebar / Contact widget area where you can place different widgets than within your regular sidebar on other posts, pages and archives.

Step 3 – Customize your contact form accordingly

By default the contact form usually displays common and most used fields like name, email, subject, text field etc. To fine-tune and customize your contact form according to your personal needs and requirements, you can add or remove certain fields which you want to display or hide.

When you click on the new Contact item in your WordPress dashboard you will be referred to the Contact Forms page. By default the plugin offers a pre-configured contact form named Contact form 1. You can now edit this contact form or create a new contact form as well as several new contact forms. In case you need further help, please see the documentation from the plugin developers.

Contact Form 7 Setup
Copy & Paste the Contact Form 7 Shortcode to your Contact Page (Screenshot)

Step 4 – Copy & paste contact form shortcode into your contact page

After you’ve completed customizing your contact form, you can take the next step to insert the contact form shortcode into your contact page. To do so, please copy the provided shortcode of the particular contact form and paste it into your contact page to display the contact form on your website. Here you can see an example of a Contact Form 7 shortcode:

[contact-form-7 id="4" title="Contact form 1"]

What about using other plugins for contact forms?

Of course you can use any other contact form plugin as well. However, in that case there is no guarantee that the styling of the contact form will work well with the overall design of your WordPress theme by MH Themes. In case you need support and further assistance with your particular contact form plugin, then you could also contact the plugin developers directly.

Solving issues with the contact page on your website

Creating the contact page and setting up the contact form plugin is usually rather simple and can be achieved with only a few clicks in the WordPress dashboard. However, in case you encounter any issues with your contact page, please have a look at our support article for the most common issues when creating a contact page in WordPress: Solving issues with the contact page.

Share this with your friends

5 Comments

  1. Hi, I can see phone numbers on the contact page in Chrome, IE and Firefox. But when I look at the same page on my iPhone, I cannot see the numbers at all. The same on my iPad as well. Can you help please? Thanks, Gareth

  2. Where is the benefit if I use the contact template? And why do I have to make an extra “Contact Sidebar” field if I choose this template?

    • Hi Daniel, having a separate sidebar for the contact page actually is the benefit of the contact template. People usually want to display different stuff in the sidebar on the contact page (like social links, additional contact information, etc…) than what is shown in the regular sidebar on other posts and pages. If you don’t want to have a sidebar on your contact page at all, then simply use the full-width page template instead.

  3. Great plugin. I really like the enhanced WordPress contact form. This is really helpful for the development of my WordPress business site. It is simple and easy to use. Thanks.

Leave a Reply to MH Themes Cancel reply

Your email address will not be published.


*