For many websites, the contact page is one of the most important pages, but all too often is not designed to its full potential.
If a user finds their way onto your contact page, it means they are already interested in getting in touch with your business.
The goal of the contact page is to make that contact as easy as possible for the user.
Contact form best practices
Here are a few quick tips for building a killer contact page;
- Make the contact page easy to access with a clear link in the main navigation and footer.
- Make any text introduction on the page quick and to-the-point and show how you can help solve the users’ problems.
- Include multiple forms of contact so that the user to choose one that is most convenient for them.
- Have a contact form but limit the number of fields to essential information.
- If you have a physical address make sure to include the address with a clickable location map.
- Include links to any social media accounts such as Twitter, Facebook, Instagram, and LinkedIn so users can follow your business.
- Let the user know if you will contact them back and give an estimated response time.
- If offering a phone number, or live chat, be sure to let users know the service operating times.
- Include a F.A.Q. section to pre-answer common questions people may be asked via the contact channels.
Pre-designed contact page templates ship with Divi
Divi comes pre-loaded with hundreds of free website templates that can be loaded into your pages using the Divi Builder. The main features of the free Divi layout packs that ship with the Divi Theme are;
- 100% free for personal or commercial use
- Load them into your page directly within the Divi Builder
- Includes royalty-free stock images created by Elegant Themes
- Full website templates that include 7-9 unique page layout templates
- Designed and built by the creators of Divi (Elegant Themes)
**This layout pack contact pages listed below are included within the Divi Builder from Divi Version 3.0.99 and above **
To use these Divi Layouts
To add these Divi Layouts to your pages you will need to;
- load the Backed Builder and click on “Load Layouts” > “Premade Layouts”, OR
- In the front-end Visual Builder, open the settings bar and click on the “+” icon and select Premade layouts. You can then browse to, or search for, the layout pack you want to use, then select the page layout and click on “Use This Layout”.
Divi layouts for contact pages
The Divi contact page layouts listed below are free to use for both personal and commercial use. They are selected from the Divi layouts that are included within the Divi Theme itself. Currently, there are over 150 contact page templates included within Divi!
1. Tutor contact page
The tutor layout pack contact form template has a brief text intro with phone and email contact on the left with a contact form on the right. There is a subtle, sweeping Divi divider module between sections. The 2nd section has three blurb modules for the student portal, careers, and courses. Below this is a section for general questions that are split into two columns and use Divi accordion modules. Below that is a blob-style call-to-action. There are also a few subtle motion scroll effects already added to the page.
2. Bar contact page
The Bar layout pack contact form template is one of the few Divi templates that have a black background. The page includes a button at the top of the page to reserve a table that could easily be linked to either a click-to-call function or to a 3rd party online booking system. The layout includes a section for opening times, followed by a Google map for the location. Below the map, there are further details for address, phone number, email and lastly a contact form using the Divi contact module.
3. Bistro contact page
The Divi Bistro layout pack contact form template would work well for any restaurant, cafe, or coffee shop. The page includes a phone number and email for bookings along with a Divi contact module above the fold. 3 Divi Blurb modules below that are allocated for phone orders, gift cards, and careers but can be used for anything you like. There is a section below this to promote private events with a final section at the bottom of the page that includes opening hours, phone, email and address contact details.
4. Library contact page
The Library contact page is a great free Divi contact page layout that offers a simple design with all the contact info your site would need. The top of the page has a header text along with a Divi contact form module on the left. To the right is a text area with address, phone number, email, opening hours and social media follow icons. The next section includes large blocks of text in a 3 by 2 grid for Frequently Asked Questions (F.A.Q.). Blow this is a Google map set to cover the width of the page and finally, the contact page footer area includes the information from the top text area plus sign-in and subscription forms.
5. Travel Blogger contact page
The Divi travel blogger layout pack contact form template offers a very simple design for those who don’t have much need for site users to contact them. This page only has a contact form and an email subscription form on the page. Most bloggers won’t have any need to have users contact them via phone or to disclose their physical location. Any inquiries will all be via the contact form. With only limited content on the page, there are 2 full-width hero images to make the page complete.
6. Hardware Store contact page
The Divi hardware store layout pack contact form template includes various information that would be required from an online store. The head section has banners above the main image for contact address, phone number, and a product search. The banner below the image is used for a postage announcement. Below is the F.A.Q. and contact information which includes toggle modules for the various F.A.Q. sections on the left and text boxes for the contact information on the right. Below this is the connect section for live chat, email subscriptions, and social media follow icons. The footer area has the basic contact details repeated with another email sign-up form.
Final thoughts on contact page templates
Each and every layout pack that is released by Elegant Themes into the Divi Builder comes with a contact page template so you have no excuse not to have a great contact page when using these templates.
Some have more content than others so browse through some of the examples and copy and paste sections as required to build up your ultimate contact page layout.
If you have a great contact page on your website built with Divi, drop the URL in the comments below.
Some very nice designs! So many great free layouts available right inside of Divi I will have to start looking in there more often,
yes, indeed. whilst it is good to have something unique and perhaps more tailored to your business style and personality, it is often best to just use a template. The reality is that at least 1/2 the Divi sites I see look pretty bad and they should just use a template which looks professional. Save time and look professional. Seems simple!