How to Remove the WordPress Header Image – Sitewide & For Specific Pages

Modern WordPress themes come with a ton of customizations. For example, the header image can be one of the defining elements of your site design. Changing it along with the background colors can make your blog look completely different. There was a time when customizing themes required you to delve into the theme code and make modifications either directly, or through a child theme. But these days, it’s baked into the WordPress code itself.

In this article, we’ll look at two things:

1. How to remove the WordPress header image for all page;
2. How to remove it for specific pages only.

Removing the Header Image for all Pages

To start with my test blog has the following header image:

If your theme supports header image modifications, you can go directly to the “Customize” menu under “Appearance” on the left hand side of the administrative dashboard.

Once you’re in the customization menu, search for the vertical tab labelled “Header Image” and expand it as shown here:

If you already have a header image selected, you can get rid of it by simply clicking “Hide image”. This will update your theme and remove the header image for all pages of your blog. Here is the outcome:

Easy right? But now what if we want to remove the header image only from a few specific pages on the site? That’s a bit more complex.

Removing the Header Image from Specific Pages

Let’s say your homepage is designed in such a way, that a header image looks nice as an introduction to your site. However when the user wants to actually read an article, you don’t want the image to clutter up the design. The approach shown above is a nuclear solution for header images. It’s all or nothing. There’s no way to specify the display of the header image using conditional statements like category, homepage etc.

If we dig a bit deeper into the WordPress code, we see that the header image is generated using the function get_header_image. Unfortunately, this doesn’t contain an “apply_filters” line, so we can’t hook into that function. But looking at the code of the “get_header_image” function, we see that it obtains the header image URL using a theme mod function. And that, it turns out, does have a filter we can use!

So open up your functions.php file or the place where you put your custom PHP code and paste the following into it:

function return_header_image($imageurl) {
    if (is_home())
        return $imageurl;

}
add_filter('theme_mod_header_image','return_header_image');

The filter “theme_mod_header_image” is a dynamic filter instead of a static one. There are a number of theme specific variables, and all of them can be filtered using the format “theme_mod_{$name}”. So in this case, we simply use the theme mod called “header_image” and we have the filter we’re looking for!

Inside the function we just check to see if the current page is the “home” or “index” page and if so, we can just return the URL of the header image. If not, we don’t do anything. For this to work, the header image needs to be already set in the theme customizations panel as shown in the first step.

What if your Theme Doesn’t have a “Customization” for the Header Image?

You might have an older theme that doesn’t allow you to choose the header image in the customizations menu. In which case, you’ll need to locate the piece of PHP code that generates the header image and add the conditional statement manually. There’s no shortcut around this unfortunately. Just remember to backup your files and use a child theme in case something goes wrong!