Your Site Header

Now, let’s work on setting up your site header – specifically focussing on getting your homepage ready to design.

In this lesson we will be:

  • Starting to work withthe WordPress customizer
  • Learning the terms for the site layout
  • Setting your home and blog pages
  • Setting your site title and tagline
  • Selecting a site header layout

The WordPress Customizer

First, log in to your WordPress admin dashboard. Then click on Appearance > Customize.

Now you will be looking at the front-end of your website, the part that your visitors will see except there will be a control panel on the left column of the screen. Your screen should look like this.

The Customizer vs The WordPress Dashboard

That control panel on the left is the WordPress customizer. This is the main place where you will control how your site looks. This is in contrast to the WordPress admin dashboard where you created pages. In general, the WordPress admin dashboard is where you will control the content of your pages. The customizer is where you control how things look.

Learning The Layout

To work with the customizer, you need to know what the different parts of the page are called.

Header Bar

The header bar is an optional page layout section. The header bar can hold:

  • A search box
  • Text that you type in
  • Your navigation
  • Social media icons

If you don’t put anything in the header bar, then it will not show up at all. So, if you don’t want to use the header bar, just leave it empty.

Header

The header (sometimes referred to as Site Header) is the section below the header bar that contains:

  • Primary navigation menu
  • Site title
  • Tag line
  • Logo

There are three different header layouts available.

  • Traditional
  • Centered
  • Navigation Below (primary)

The layout you select will somewhat depend on how many items are in your primary navigation. The Traditional layout designates 50% of the screen width for your site navigation. This is good if you only have a few pages. Otherwise, you will want to select either Centered or Navigation Below so you will have the full width of the page for your navigation.

Content Sections

The content sections you create in the WordPress admin when you are working with the Page Builder will appear below the header. You can have as many content sections as you’d like. The content sections you create are really the driving force behind your page layouts. You will find that you can create almost any page layout you want with the page builder tools provided by Make Plus. We have a completed lesson series on how to use the page builder tools.

In this lesson series you will get an introduction to the page builder tools. If you want to learn the details of how each tool works, check out the page builder lesson series.

Footer

Finally, the bottom section of the page is the footer. The footer can hold up to 4 widget areas. Widget areas are basically just squares of content. So, you might put your address and contact information in the footer, perhaps a brief blurb of content about your business, a secondary navigation of less popular pages like terms of service, or maybe a little form to sign up for your email newsletter.

Linking Up Home and Blog Pages

By default, WordPress assumes you would like to list your blog posts on your homepage. Most of the time you want to have your homepage be an actual page with content on it and you set up a different page for your blog. So, let’s tell WordPress that you want your homepage to be an actual page and that you’ll have a designated blog page for your blog posts.

In the WordPress customizer, click General > Homepage Settings.

Then select your homepage displays A static page.

Choose your Home page as your Homepage and your Blog page as your Posts page.

Be sure to click the Publish button at the top of the customizer to save these changes. Even though you are seeing the changes in real-time as you modify the settings, changes only get saved when you click Publish.

After you have published your changes click the back arrow on the customizer twice to return to the main customizer’s main menu.

Set Your Site Title and Tagline

Now let’s set your site title and tagline. Your site title should be your business name. Your tagline should be a very short phrase that describes what your business is about. It’s important to put some thought into your tagline because you want to let your visitors know what they can expect from your website as fast as possible. A good tagline will reduce your website’s bounce rate (people visiting your site then immediately leaving) because people will be able to quickly understand what you’re site is about so they will know what you are offering. In other words, your tag line will give your visitors a reason for continuing to browse your site.

Your tagline should be short, maybe three or four words. The process of thinking through what you want your tagline to be will also help you with the future marketing of your business. It will get you thinking about what makes your business unique and what sets you apart from your competition.

To set your site title and tagline click General > Site Identity in the customizer.

That will reveal the settings for your site title and tag line.

Now, just type in your site title and tagline then hit the Publish button to save your changes.

Hiding The Header Bar

You may want to come back later and use the header bar for a promotional message or something. But, for now, let’s hide the header bar. To hide the header bar use the customizer and click Layout > Header then make sure you have all the Header Bar Text options empty.

While you’re here in the Layout > Header section of the customize, go ahead and select the Header Layout you would like to use. I have selected Navigation Below, but you are welcome to use whichever layout you like the most.

Also, note that if you select the Navigation Below header layout, you can also enable the Show search field option and the search field will show in the header NOT in the header bar. This gives a nice balance to the appearance of the header and also provides a search feature for your website.

Coming Up Next…

In the next lesson we will start adding colors, pictures, and content to your home page.

Get Tips Like This In Your Inbox

If you liked this post, get more like this one emailed to you.

We respect your privacy. Cancel anytime.