Site Tutorials

Tutorials »Build a Business Website Tutorial

This guide is designed to help you build a complete website to show off a small business, but you can use these steps to create any sort of website! It will help you:

  1. Choose a theme.
  2. Add content to your site.
  3. Format your site so it works for a small business.

Choosing a Theme
Adding Your First Page
Editing Pages
Creating a Contact Page
Creating Your Other Pages
Setting a Home Page
Creating a Menu
Selling Products on WordPress.com
Adding Widgets
Adding your Brand
Sharing to Social Media

Before you get started, it can be helpful to think about how you’d like to structure your site. What information and images do you want visitors to find? How would you like to organize them? This will help you decide what pages to add, and give you an idea of how you want the site to look.

We do offer a Business Plan that provides more functionality that any business owner looking to start a site might find useful. Purchasing a Business plan is not required for the steps in this guide, which can be applied to a site on any plan.

Let’s get started!


Choosing a Theme

The first step is to choose a theme for your site. WordPress.com has more than 200 themes, and there are many options for a business website. Some themes involve more setup than others. We have a few specific recommendations for simpler themes:

For the sake of this tutorial, we’ll use Goran, but you can follow along with these instructions using any of these themes.


↑ Table of Contents ↑

Adding Your First Page

Your site is made up of Blog Posts and Pages.

  • Posts are for content that is added often, like journal entries, or news articles.
  • Pages are for static content, like contact info, or an about page.

You can have as many or as few pages as you’d like, although most small business websites have 4-10 pages.

To get started, click on My Site(s) → Site → Pages. Then click the Add New Page button.

Add New Page

This will bring you to the WordPress Editor, where you’ll create and edit the new page. Think of something you want your new page to be about, such as an “About Page” – a page that might describe who you are or what your business does.

In the editor, go ahead and add your own title and content for a page on your site now. Here’s a breakdown of some of the important sections within the editor:

You add content to your pages by using Blocks. Blocks are modules that contain various content, such as paragraphs, images, galleries, audio and more! Some basic blocks you might want to add to get you started:

  • Paragraph: This is a basic block that adds plain text to your page or post. More information.
  • Heading: These blocks are good for adding titles within your post or page for breaking up your content. More information.
  • Image: Lets you add images inside a block. More information.
  • Media & Text: This block lets you put an image and text side by side. More information.
  • Columns: This block lets you put other blocks side by side in rows and columns. More information.

There are way more blocks than these! For a full list of blocks and their support documents, check out this support document.

To add a block, click on the inserter icon and search for the block you want. Here’s an example of adding an Image Block:

You can also add blocks by typing / and then searching for the block you want, like this:

This image has an empty alt attribute; its file name is gutenberg-block-type-shortcut.png


Featured Images

At the top of each page on your site, you can add an image called a Featured Image. You can see how this looks on any of the pages in the Goran theme demo, like this one.

Each theme uses Featured Images a bit differently. The Goran theme, for example, uses Featured Images as the image at the top of each page. If you’re using a different theme, the Featured Image may show differently.

To set a Featured Image, you’ll use the Featured Image section on the right side of the editor. Click on the Featured Image section, and you’ll see a button allowing you to upload a Featured Image.

When you’re done adding blocks or images, click the Publish button to add that page to your site. You’ve successfully built the first page on your website!


↑ Table of Contents ↑

Editing Pages

If you already have some pages added, or if the theme demo created some for you, you can go to My Site(s) → Site → Pages. This will show you all of the pages on your site. Click on the About page you just published, or any other page you’d like, to edit it.

If the theme you activated has demo content already, replace the example text with your own text. Make any other content changes you want, such as adding a featured image. When you’re done creating this page, click the Update button to save your changes.


↑ Table of Contents ↑

Creating a Contact page

Some themes will add a Contact page automatically. If you see a Contact page already after going to My Site(s) Site→ Pages, edit that page instead of creating a new one.

The Contact page gives the opportunity to the visitors interested in your work to contact you directly. On the Contact page for your site, we recommend you don’t include your email address. Having your email address publicly visible can attract spammers. Instead, you can use a Contact Form on your site. When visitors fill out the Contact Form, you’ll receive an email with their message, but they won’t see your email address.

If your site doesn’t have a Contact page yet, add one as you did with the first page. Click on My Site(s) → Site → Pages, then on the right side, click Add New Page. Set the title of the page to Contact.

After adding the title, add some text explaining how visitors can contact you, and when they can expect a response. Next, add a Contact Form by using the Form Block.

You can edit the Form Block to include more fields, mark some as required, and so on. There’s more information on how to use this block here.

Give your contact page a featured image if you’d like. Then when you’re ready, create your Contact page by publishing it using the Publish button.


↑ Table of Contents ↑

Creating Your Other Pages

If you have other pages that you’d like to add to your site, now is the time to add them. Just as we did before, you’ll want to add a new page using the Add button next to the Pages option.

Repeat this step for each page you’d like to create on your website. You can choose to add as many or as few pages as you’d like.

For example, you may want to create a page called “Home” that contains static information to visitors on your site.


↑ Table of Contents ↑

Setting a Home Page

By default, many WordPress.com theme’s show a list of your latest blog posts on the home page. After you’ve created a few pages on your site, you can set one of these as your homepage, so visitors see that page first upon visiting your site.

To Set a Homepage:

  1. Go to your My Sites → Design → Customize → Homepage Settings.
  2. Select A static page
  3. In the dropdown menus, select the page you want to use as your Homepage.
  4. Optionally, you can also set another one of your pages to display a list of any blog posts you’ve written under Posts Page.
  5. Click Publish to save your changes.

For more information on setting a static home page, see this support document.


↑ Table of Contents ↑

Creating a Menu

So now you have all of your pages, but how are people going to visit them? By adding pages to your menu, we can provide a way for visitors to navigate your site and its pages.

To Create a Menu:

  1. Click on My Site → Design → Customize → Menus.
  2. Choose a menu you want to edit, or create a new one. When you create a site, a Primary Menu will be created automatically.
  3. Click on Add Items. In the menu that slides out, you’ll see a list of pages, categories, posts, etc. that you can add to your menu. Click on them to add them to the menu.
  4. You can click and drag menu items around to re-arrange them, or drag them and indent them underneath one another to create dropdowns.
  5. Make sure that “Primary Menu” is checked under Menu Location.
Click the image to see a larger version

When you’re finished adding items to your menu, remember to click the Publish button to save the changes to your menu.

If you want to setup a more complex menu, you can find more detailed instructions on customizing your menu in our support docs.


↑ Table of Contents ↑

Selling Products on WordPress.com

There are a few ways to sell products on your site:

To read more about different options for selling products, check out this support document for more details.


↑ Table of Contents ↑

Adding Widgets

Another way to enhance your site’s layout is by using widgets. Widgets are additional content you can add to your site’s sidebars and footer, and can be tailored for each of your pages.

Widgets can do a variety of things. A few that might be useful when you start out:

  • Contact Info Widget – Display your contact information, including an embedded Google map. More information.
  • Text Widget – A simple widget that lets you add any text that you want. Great for providing general information, an About Us blurb, and more! More Information.
  • Search Widget – Creates a search bar that people can use to find posts, pages, and other content on your site. More information.
  • Top Posts & Pages Widget – Show a list of your most popular posts and pages on your site. More information.

And lots more!

In these examples, we are using widgets in two different areas: the footer and the sidebar (on individual pages):

businesswebsitedemo-9
Footer widget area
businesswebsitedemo-10
Sidebar widget area

The footer of your site is the section at the bottom of each page, and the sidebar appears on either the left or right hand side of your site. Different themes may not support all widget areas, or have additional ones.

To add widgets to your site:

  1. Go to My Site → Design Customize → Widgets.
  2. Select a widget area, such as Footer or Sidebar.
  3. Click on Add Widget, then select the widget you want to add to your site.
  4. Click Publish to save your changes.
Add a Widget
Click on the image to see a larger version

Certain themes may only show widgets on specific page types, and some may not have certain widget areas at all.

Here’s a video with instructions on how to add a widget as well:

For more detailed instructions on how to use widgets, see this support document.


↑ Table of Contents ↑

Adding your Brand

Once you’ve added your content and images, there are a few other things you may want. These extras help display your brand, so visitors know your business better.

Adding a Domain

Now it’s time to give your website a unique address, via a custom domain. A credit to add a custom domain – either one you already own or a free year of a new domain registration – is included with any paid plan on WordPress.com. To add a custom domain:

  1. Go to My Sites → Manage → Domains → Add.
  2. Type the domain name you wish to use into the search field. You can register a brand new domain by choosing one of the available options. If you already own a domain at another provider, map the domain or transfer it to us.
  3. Follow the remaining steps to complete the setup process. Mapping and transferring domains you already own require additional steps. You can read those here.

For more help with adding a custom domain, see our Domains support doc.

Custom Logo

Many themes allow you to add a custom logo to the header of your website. This can be added via My Sites → Design Customize → Site Identity. In the Site Identity section, you have the option of hiding your Site Title and Tagline. You can also choose how you to display the WordPress.com footer credit.

More information on adding your own logo can be found here.

Custom colors

Your brand may have custom colors you would like to use on your website. With a Premium Plan or higher, you have access to a theme’s custom colors. This can be found in My Sites → Design → Customize → Colors & Backgrounds. The number of colors available to customize will vary depending on the theme you choose.

To customize a color, click on the color circle you wish to change. Then, choose a preselected color or click the “pick your own color” link to open the color picker tool. The color picker tool allows you to use a color based on a specific hex value. This list of common colors and hex values may may be a good place to start.

For more help with custom colors and backgrounds, see our Custom Colors support doc.

Additionally, there are preselected color pallets in the Colors & Backgrounds section that will apply a pre-made pallete of colors to your website.


↑ Table of Contents ↑

Sharing to Social Media

As you create your website, one final decision is about how your site will be connected to other sites and social media. WordPress.com provides Sharing buttons at the end of posts and pages, that can be toggled on and off. Here’s an example of what they look like:

Sharing Buttons

Sharing Buttons

Typically, Sharing buttons are used for posts. You can manage Sharing buttons for your posts and pages by going to My Site → Tools → Marketing → Sharing Buttons.

On the Sharing Buttons tab, you’ll see an Options section. You can turn Sharing Buttons on or off for Pages, by unchecking the ‘Pages’ or ‘Posts’ option under ‘Show sharing buttons on’. Then, hit the Save Changes button.

Connections

If you’re using a blog on your site, you can manage social media connections so new blog posts are automatically published to each platform. You can manage these connections under My Site → Tools → Marketing → Connections.

There’s more info on how to set this up here.


↑ Table of Contents ↑

Conclusion

That’s it! You’ve successfully created and set up your business website. Congratulations!

In the future, if you’d like to add to or grow your site, you can do that with WordPress.com too. Try searching our support site, available at support.wordpress.com, for the thing you’d like to do!

Not quite what you're looking for?

Get Help