Get all themes with lifetime updates for 95 USD. View all promotions

Customize your page header

By default, you see a background image in your page header, along with the site title, description, and the main menu. You can change all of this in a variety of ways.

m header

  1. Change the background colour
  2. Remove or change the background image
  3. Resize the height of the header area
  4. Use a logo with the site title and description
  5. Use a logo with either the title or description
  6. Use a logo by itself

I won’t go through the site title and logo setup as this falls under the basic WordPress “Site Identity” settings in the customizer or the main settings of WordPress, but I will take you through the theme-related options built into it.

Background Header Image

The default header image I am using for the theme is a transparent image. This lets the background colour of the header show through.

  1. Go to Appearance >> Header Image
  2. This will take you to the customizer and will automatically open up to this:
    mp header image setting
  3. From here, you can remove the default image by clicking on “Hide Image” or upload a new one “Add new image“. 
  4. If you upload more than one image, you have the choice to use the Randomize Images feature which means every time someone refreshes the page, or enters the page, the image rotates to a new image (randomly).
  5. Click “Save & Publish

Change the Background Colour

  1. Go to Appearance >> Customize >> Colour
  2. Find the “Header Background Colour” setting and use the selector to choose your colour.
    mp header bg colour
  3. Click “Save & Publish

Change the Header Height

You can adjust the height of your header area from the default 1 to 5 and in increments of 1. The value represents percent.

  1. Go to Appearance >> Customize >> Theme Options
  2. Look for the “Header Size” setting and use the up/down arrows when you mouseover the field to increase/decrease the header height. 
    mp header height
  3. Click “Save & Publish