Adding A Default Featured Image Or Thumbnail In WordPress

What's a featured image in WordPress?

WordPress, the software this site runs on, works by allowing authors to enter web page content (sometimes officially called 'posts', as in a blog post, and which I often colloquially on this site refer to as an 'article') which it then formats nicely to display in web viewers. When you enter a post, it lets you specify a bunch of other information pertaining to it: category, some additional tags, a custom summary to show search engines, etc. Among the things it allows you to specify is a 'featured image', or 'thumbnail', an image representing that post.

You see featured images all over the site: in the backgrounds of individual pages, as tiny squares next to the menu entry for a page in the menus up top, on the "Related Posts" entries at the bottom of a lot of pages, or in the fancy front page "hero" section—the grid of featured articles—appearing in the row background when you hover your mouse over one of the article descriptions.

Examples of Featured Images:

~ Click any image to enlarge ~
featuredimages-1.png, A 'Adding A Default Featured Image Or Thumbnail In WordPress' image with ID# 31744featured-image-2-1.png, A 'Adding A Default Featured Image Or Thumbnail In WordPress' image with ID# 31745

What if you don't set a featured image for a post?

Well, that's the thing. WordPress has absolutely nothing to handle if you don't include a featured image for a post. Now, me, I like to make this fancy illustrations for my articles, so sometimes I don't immediately have a featured image set as I haven't created one I like yet (and some I never get around to doing it for.) But the menus in particular look funny if some of the menu entries are missing thumbnail images.

So, I wanted WordPress to automatically fill in a default image if something in the site layout expected one but I hadn't yet added one for a given article.

PHP to the rescue! Creating A Default Thumbnail in WordPress

On this site, any post without a featured image specifically set (such as this one) displays the default floral 'K' insignia anywhere on the site where a thumbnail is displayed.

I had looked around the web and none of the solutions I found worked, but I eventually figured out that adding the following to my WordPress child theme's functions.php file did the trick:

/**
* Default post thumbnail image.
*
*/

$defaultThumbnailId = 289;

function mk_filter_thumbnail_id( $thumbnail_id, $post = null ) {
     if ( ! $thumbnail_id ) {
          $thumbnail_id = $defaultThumbnailId; //id of default featured image
     }
    return $thumbnail_id;
}

if (! is_admin() ) { //don't do this on admin pages, it sometimes overwrites thumbnails in the back-end view of the media library
add_filter( 'post_thumbnail_id', 'mk_filter_thumbnail_id', 20, 5 );
}

The reason we put $defaultThumbnailId outside the function is so we can check it from other scripts. For instance, I decided I don't want my archive pages to show any thumbnail if a post doesn't have one. The archive page templace contained get_template_part( 'template-parts/entry/entry-thumbnail' ); so now I was able to replace this with: 

<?php 
global $defaultThumbnailId; 
if (get_post_thumbnail_id() != $defaultThumbnailId) {
    get_template_part( 'template-parts/entry/entry-thumbnail' ); 
}
?>

And now the archive (category) pages on this side skip showing a thumbnail if the post doesn't have one, but everywhere else on the side, it uses my default image (at this writing, set to the red floral "K" embled you see around the site.)

By the way, just writing so I'll remember it, the third and fourth parameters of add_filter() set a priority so multiple filters can run before or after each other, and the number of parameters the function should expect. WordPress's whole "filter" functionality is an odd way of calling functions, although I suppose it's a practical if roundabout way of hooking into existing functions to add your own code modifications.

Related Articles