WordPress Custom Header Image banners

This tutorial will show you how to use the WordPress Custom Header feature. Although it’s not as flexible as using banner images with text widgets, it does have a built-in feature that lets you display the same image and caption across all pages of your website, or you can even set it to randomly rotate images when pages load.

At first glance, it’s hard to tell if the banner and caption box is the Custom Header Image or an actual banner loading in a widget…I wanted to keep it as closely related as possible in style. By default, the custom header image is loaded when you first install and activate this theme, so lets dig into the tutorial…

Disable The Header Image

  1. Go to Appearance >> Customize >> Header Image
  2. By default, you should see this…you can remove the image by clicking on “Hide Image” or you can add a new image “Add new image”.
    current header image
  3. Find the setting “Show or Hide the Custom Header” which will completely remove the custom image and its caption box.
    show hide header image
  4. Uncheck the box
  5. Click “Save & Publish

Now your WP Custom Header Image will be gone and you can use the other method if you wish.

Adding Rotating Images

If you opt in to use the custom header image feature, remember this will show on “all” pages throughout your site. But if you want to have different images display behind the caption box, you can configure the settings to do just that.

  1. Go to Appearance >> Customize >> Header Image
  2. Change the current header image if you wish by clicking on “Add New Image” and then crop your image or skip the cropping if you already have the size you want.
    crop header image
  3. Each new image you want to add, click on the “Add new image” again.
  4. Once you are done, you should see something like this:
    random header images
  5. Click on the “Randomize uploaded headers
  6. Click “Save & Publish

Adding/Updating the Caption Box Content

By default, the box will already be set and ready for your title and caption, but we will make changes to these two elements.

  1. Go to Appearance >> Customize >> Header Image
  2. Find the “Header Caption Title” setting and make your change
    header caption title
  3. Find the “Header Caption” setting and make your change
    header caption
  4. Click “Save & Publish

Note this caption box will be displayed on all pages throughout your site.