How to Build a Business Contact Page With WordPress Blocks

Running a business isn’t always easy. There are typically bills to pay, products to stock, and a website to maintain. However, it doesn’t stop there: you’ll also want to stay in touch with new and returning customers. This means that a contact page is essential.

Fortunately, creating this page doesn’t have to be hard. The WordPress Block Editor is here to help. By using its large selection of helpful blocks, you can build a high-quality business contact page in a matter of minutes.

In this article, we’ll look at why having a contact page is so important. Then we’ll walk you through three simple steps to design one of your own. Let’s dive right in!

Why It’s Vital to Design Your Contact Page Carefully

You probably don’t need us to tell you that a contact page is important. After all, how else would customers get in touch with your business? However, just including this page isn’t enough. Its design can determine whether or not it’s successful.

For example, if you include too many elements on the page, it can look busy and intimidate users. This means that even as your traffic goes up, your conversions might lag behind. The same could result from a page that looks unprofessional or contains broken or confusing elements.

Contact pages are also a prime opportunity to strengthen your brand. You can think of them as the online equivalent to business cards. The page’s design, communication options, and ease of use all reflect how you run your organization and what face it presents to the world.

In other words, there are many benefits to including a carefully-designed contact page on your website. However, building one that lives up to its full potential isn’t always easy. That’s why we recommend using the WordPress Block Editor for this task.

The Block Editor makes page building easy. You can divide your contact page into discrete, easy-to-understand units of content. Then you can customize and organize those elements however you like. With this flexibility and simplicity, you can get your contact page up and running in no time.

How to Build a Business Contact Page With WordPress Blocks (3 Steps)

If you’re ready to build a contact page, the following three steps will get you started. While your contact page should be uniquely designed to suit your business and brand, we’ll go over the basic elements you’ll want to include regardless of your specific niche.

Step 1: Add Your Basic Contact Information

Start by creating a fresh page. If you have a WordPress.com website, you’ll be able to use a predefined layout for your contact page:

Beginning with a layout (and then customizing it to suit your needs) can help to speed up the process. However, you can also start from scratch if you prefer. 

Whatever route you choose, there are three elements you may want to place on the page right away. These are the Contact Info block, the Business Hours block, and the Map block.

The Contact Info block can hold the essential details about your business. All you have to do is fill in the fields it provides:

You don’t have to complete every field. Instead, you can focus on the ones that matter to your business. You can select an individual line and open up the settings to see your options. These include copying, deleting, and moving it:

If you want to link your business’ address to a Google Maps page, you can turn on the Link address to Google Maps option.

Next, let’s move on to the Business Hours block:

Here, you can enter the hours your business is available each day. If you’re not open on a particular day, you can simply toggle the relevant switch to Closed. You can also click on Add Hours to add two separate open times for one day.

Finally, let’s take a look at the Map block. You may have linked to Google Maps earlier, but this block goes further. It enables you to add an interactive map directly on your contact page:

You can customize everything from the interface design to whether individual street names are shown. This can be particularly useful if your physical location is tucked away and hard to find.

Step 2: Include Your Preferred Contact Form

Right now, your contact page has some key information about your business. However, you haven’t yet provided a direct way to get in touch. That’s where a contact form comes in handy.

As with layouts, the WordPress Editor provides some pre-built contact forms you can use via the Form block. We’ll look at three useful options: Contact Form, Registration Form, and Appointment Form. Each one can serve a different purpose on your contact page.

Let’s start with the basic Contact Form:

This form is short and easy to fill in. By keeping your form as simple as possible, you’ll decrease friction and encourage more visitors to reach out.

Alternatively, you might want to include a Registration Form. This enables you to stay in touch with your users directly, even after you’ve answered their initial inquiries:

Finally, some businesses offer the option to book appointments. If you want to receive these requests directly from your contact page, adding an Appointment Form can save you a lot of time:

For our purposes, we’ll only be using the simple Contact Form. However, you can use whatever option best suits your needs.

We only recommend that you avoid including more than one form. This could lead to a busy-looking page that intimidates visitors. If you require more than one form, it may be best to feature them on separate pages instead.

Step 3: Connect Your Social Media Profiles

Finally, let’s wrap up with a look at a more modern form of communication: social media. The vast majority of your customers will have at least one social media profile (many will have several). What’s more, a lot of people prefer to reach out to businesses via social sites for customer service, rather than using traditional email and phone channels.

Fortunately, the Block Editor offers a lot of social media integrations. This includes features to connect your site with Facebook, Pinterest, Tumblr, and more.

In most cases, all you have to do is enter the link to your account on a particular platform. The editor will take care of the embedding process. For example, here’s what it looks like if we add a link to the official Twitter account’s feed:

We recommend that you only embed one social media account on your contact page. Just as with forms, too much information can be overwhelming. Plus, if you post the same (or similar) content on various platforms, featuring more than one can be very repetitive.

However, there’s still a way to point visitors towards all of your key social profiles. All you need to do is use the Social Icons block. This will display your accounts (and links out to them) in a neat, compact fashion. That way, you provide several options for getting in touch, without sacrificing a streamlined design:

Once you’re done customizing your contact page, don’t forget to preview it on the front end before hitting Publish. For example, here’s what our simple contact page looks like:

Remember that you don’t have to maintain the same contact page forever. Your customers might respond better to certain modes of communication, so don’t be afraid to make edits over time to better meet their needs. This can lead to a cleaner, more effective contact page that brings in valuable leads.

Conclusion

A contact page is one of the most important elements you can include on your business website. It’s vital that it offers a clear user experience and meets your customers’ needs. Fortunately, you can build a custom page easily with the help of the intuitive WordPress Block Editor.

In this article, we covered three easy steps to launch a top-tier business contact page:

  1. Add basic information about your organization.
  2. Provide users with a quick way to get in touch.
  3. Connect to your social media accounts.

ABOUT THE AUTHOR

The WordPress.com Team

We're a team of happiness engineers, developers, editors, and WordPress experts. Our team personally curates and serves up the best resources to help you no matter where you are in your blogging or website-building journey. At WordPress.com, our mission is to democratize publishing one website at a time. Create a free website or build a blog with ease on WordPress.com. Dozens of free, customizable, mobile-ready designs and themes.

More by The WordPress.com Team