In many WordPress themes, you can set a custom header image for your WordPress website. This is great if you want to give your site your own look and feel.

custom header images in wordpress -

In this brief tutorial we explain how to set a custom header image for your site. You’ll also find out how you can let WordPress automatically display a random header image on every page (which is great if you have more than one header image and you want to add some variety to your site). Plus we discuss how you can set a specific header image for each page; so a different image for every page.

The basics: setting a custom header image for your website

To do this, in your WordPress admin navigate to Appearance > Header. Depending on your theme there will be one or more default header images you can choose from. If you like these, great – just go ahead and activate one of those.

[whitespace]

Default header images in the Simplicity WordPress theme

The default header images in our Simplicity theme.


[whitespace]
If you don’t like the images that come with your theme, you can also use your own. To do so, go to “select image” and choose an image from your computer or one from your media library.

After you’ve chosen the image you’d like to use, WordPress lets you crop it to a size you like. So you can choose the part of the image you want to use as your header. Or, if you want to use the whole image, simply skip the cropping step and use the image as it is.

If you don’t see the header entry in your WordPress admin, it’s possible that your theme doesn’t support custom header images. In that case you can talk to your website developer and ask them to implement this for you in your theme.

A step further: a random header image on every page

You don’t have to settle for one image across your whole website. If your theme has several default images, or if you’ve uploaded several of your own, you can also let WordPress display these randomly across your pages. it’s really easy to do so: simply tick the “Random” radio-button and you’re done.
[whitespace]
Setting a random header image in WordPress
[whitespace]
So say you have six header images. By using the random setting, each time someone visits a page on your website a random image from these six shows up on the page.

Full control: a specific header image on a page

It’s also possible to set a specific header image for certain pages of your website. This is a great way of setting the theme or feel for that page. For example, if you have a post with a book review, you might put an image of the book you’re reviewing at the top of that post.

By the way, it doesn’t matter whether you’re using a single header image across your whole website or a random one on each page. By setting a specific header for a certain page, that header will always show on that page.

Depending on your theme, there are 2 ways you can go about this …

  1. Through your theme’s built in functionality
  2. By installing a plugin that adds this functionality

Option 1: already built into your theme

Some themes that support page specific header images do so through the featured image functionality. You set an image there, and it then displays as the header image for that page. Our themes don’t use the featured image for this, because we’ve left it free for other functionality. So if you use one of our themes, read on…
[whitespace]
The featured image box in WordPress
[whitespace]

Option 2: using a plugin

If your theme doesn’t support page specific custom header images, you can easily add this functionality with a beautiful little plugin called “Custom Header Extended“.

To install it, go to your website’s dashboard, and choose Plugins > Add new.

In the search box in the top right of your screen, search for the plugin by typing “custom header extended”.
[whitespace]

[whitespace]
Locate the Custom Header Extended plugin and install it by clicking the “install now” button.
[whitespace]

[whitespace]
In the next screen, click “Activate this Plugin” to make it active. This will finish the installation.
[whitespace]

[whitespace]
This plugin adds a box below the featured image box for setting the header image on the page you’re working on. It’s a very neat way of doing this and works very well. And as a bonus, it leaves your featured image free for something else (certain plugins use the featured image facility, for example certain related posts plugins).
[whitespace]
Custom header extended meta-box
[whitespace]
Feel free to ask questions about using a custom header image, we’ll be happy to help :)

Pin It on Pinterest