Use the WordPress Header feature for page banners

Part of WordPress includes a “Header” feature that lets you upload and crop photos that you can use in a header of your page. Before in the past the header would have the site title and description on top of it and you were able to change the background of it. Well things have changed and advanced to a point that you can use the header in many ways, whereas for Luminescence, you get to use it as a type of showcase banner for your pages.

You can see an example use of this header here:

Header Image

How to Find the WP Header Feature

First, there will be two methods you can work with the WP Header feature:

1. The first is clicking on the “Header” link in the left panel in your dashboard under “Appearance“. When you are in your dashboard, this is going to be the fastest way of accessing the setup of your header.
2. The other will be accessing your theme’s customizer by clicking on the text link labeled as “Customize” or when you are in the main Dashboard area (home page of your admin) you will can click on the big blue button labeled as “Customize this site“.

Preparing Your Image(s)

I always recommend people prepare their images before uploading, such as cropping, sizing, and optimization. However, this tutorial is more about getting your images into your showcase header, but the WP Header feature still gives you a reasonably good cropping tool.

For size of images, I recommend using large 725 pixel wide dimensions so that when the image is cropped and published, you can retain a good quality photo. Please be aware that WordPress does not resize images to be “bigger”, but rather they make them smaller. My rule of thumb is the bigger the image, the better.

Adding Your Photo

1. Go to Appearance >> Header
2. In the right side window area, click “Choose File” and then “Upload” or you can choose an existing image from your library
3. You can upload additional images if you wish to have a choice of headers, but it also allows you to have a rotating header each time someone refreshes the screen
4. Click “Save Changes“

Managing Your Header from the Customizer

1. Go to Appearance >> Themes >> Click on the text link “Customize“
2. Click on the tab labeled as “Header Image“
3. You can change the header image from here by clicking on the small thumbnail you see in the screenshot below, which will then show you existing images
   
4. You can change your headers from here as well simply by clicking on any of the thumbnails
5. If you wish to upload a different photo, you will need to use the other method of managing he headers because WordPress has not made the upload and cropping method available through the Customizer yet.
6. With any alternate thumbnail choice that you select, click Save & Publish, then Close to get out of the Customizer.