Featured Image Replacement

It took me a few days, but  I finally got this working! I have a photo gallery theme I’m working on, and I’d like it to always display a featured image in the loop. Here were my requirements:

  1. If the featured image isn’t set, look for images within the post and display the first one.
  2. If an image isn’t in the post but there’s a gallery, display the first image from the gallery.
  3. If there is no image and is no gallery, display a default image.

Setting a default image when the featured image is blank (3) was pretty easy.  Looking for an image within the post (1) was fairly doable. But, finding an image within a gallery (2) was giving me problems.

What happens when WordPress has you drop a gallery in a post is shortcode processing. That means the code looks something like this (with brackets instead of curly braces)…

{gallery link="file" ids="1,2,3,4,5,6"}

…until you visit the page it sits on. Then, WordPress processes that line to show your gallery based on the IDs of the images added.

So, with the ability to call an image from its ID, I was able to implement wp_get_attachment_image_src to return the image I needed from the gallery!

Here’s what you do:

Add a Function to your functions.php File

Open up your functions.php file and drop this bit of code into it (change
sharons_new_image to whatever you prefer):

function sharons_new_image() {
	global $post;
	ob_start();
	ob_end_clean();
	$galID = str_replace('ids="', '', strstr(strstr($post->post_content, 'ids="'), ',', true));

	$first_img = strstr($post->post_content, '<img');
	$first_gal = wp_get_attachment_image_src( $galID, 'full' );
	$header_image = get_header_image();
	$loop_default_image = home_url() . '/wp-admin/images/w-logo-blue.png';

	if(!empty($first_img)) {
		$returnimage = $first_img;
	} else if(!empty($first_gal)) {
		$returnimage = $first_gal[0];
	} else if(!empty($header_image)) {
		$returnimage = $header_image;
	} else {
		$returnimage = $wp_logo_image;
	}
	return $returnimage;
}

looks in your post ($post->post_content) for the first instance of img=".

$galID is looking for the first number after ids=" (the rest of that code is cutting out any other text still remaining).

$first_gal is looking for the image based on the ID found in $galID.

get_header_image() is the WordPress default code for calling the header image (set within the Theme Customize window).

If you don’t have a header image set, I’ve set the WordPress logo as the default at $loop_default_image. This image will be called if no other image is found. If you want to set it to a specific image, you can replace $loop_default_image = home_url() . '/wp-admin/images/w-logo-blue.png'; with something like this:

$loop_default_image = get_template_directory_uri() . '/images/loopimage.jpg';

This code above looks in your theme’s “images” folder for an image called “loopimage.jpg”. Customize this link as needed.

Call the Function in your index.php File

Next, we need to tell our theme’s index.php page to use this function. Most themes may have the_post_thumbnail() somewhere; if yours doesn’t, you can add it manually (usually above the the_excerpt() or the_content() line).

Change your the_post_thumbnail() to look like this instead:

<?php if (has_post_thumbnail()) {
	the_post_thumbnail();
} else {
	echo '<img src="' . sharons_new_image() . '" />';
} ?>

That’s it! If you have questions or problems, leave them in the comments. Thanks!

Published
Categorized as WordPress

By Sharon

Hello there! I'm a web developer in Louisville, Kentucky. I started on this career path by purchasing an O’Reilly PHP book from Barnes & Noble in 1999. Since then, my desire to learn as much as I can about web site building and server maintenance has grown. I love technology and what it can do to simplify our lives and make it more interesting all at the same time. Seeing a creative design come to life and bringing it into the web world is my favorite puzzle to solve. My server experience is based around launching WordPress-friendly servers — Linux (Ubuntu and Centos flavors), Apache, MySQL, and PHP. I have worked with various modules, extensions, installs such as ImageMagick, LetsEncrypt, Sass, LESS, and the Homebrew family of extension. My main love has been with PHP, and my CMS of choice has been WordPress since its inception in 2003. I find it flexible, secure, easy to design around, and so customizable. My strengths are in developing from-scratch plugins and themes for the WordPress CMS with a strong background in PHP and MySQL development.

Leave a comment

Your email address will not be published. Required fields are marked *