WP-Mix

Here’s how to set the first attachment as the featured image for posts in WordPress. This is useful for User Submitted Posts, which attaches uploaded images to each submitted post.

Update! User Submitted Posts now features an option to automatically set Featured Images. Check out the plugin settings and documentation for more information. </update>

Before implementing this technique, it helps to publish a few test posts that each have at least one attached image. Also, remember to make backups before modifying any files.

Step 1: Enable Featured Images

Add the following code to functions.php:

// featured images
add_theme_support('post-thumbnails');
set_post_thumbnail_size(130, 100, true); // width, height, hard crop

This snippet does two things: 1) adds theme support for featured images, and 2) sets a reasonable size for the featured images (which were once known as “post thumbnails”). Feel free to adjust the size as needed.

Step 2: Set & Display

With some test posts in place and theme support for featured images, it’s time to bring it all together in your theme’s single.php file (for example) with the following code placed anywhere in the loop:

<?php // @ https://wp-mix.com/set-attachment-featured-image/
if (has_post_thumbnail()) {
	// display the featured image
	the_post_thumbnail();
} else {
	// set the featured image
	$attachments = get_posts(array(
		'post_type' => 'attachment', 
		'post_mime_type'=>'image', 
		'posts_per_page' => 0, 
		'post_parent' => $post->ID, 
		'order'=>'ASC'
	));
	if ($attachments) {
		foreach ($attachments as $attachment) {
			set_post_thumbnail($post->ID, $attachment->ID);
			break;
		}
		// display the featured image
		the_post_thumbnail();
	}
} ?>

With this code: if the post has a featured image it’s displayed, otherwise we set the first attachment as the “post thumbnail” (aka featured image) and then display it. Notice that we’re using a variety of related WP functions:

• has_post_thumbnail()
• set_post_thumbnail()
• the_post_thumbnail()

Using the Codex as a guide, it’s possible to customize this technique in a variety of ways.

Alternate method

If you would rather not mess with adding code to the loop, here is an alternate method for setting the featured image via the functions.php file:

// @ https://wp-mix.com/set-attachment-featured-image/
add_filter('the_content', 'set_featured_image_from_attachment');
function set_featured_image_from_attachment($content) {
	global $post;
	if (has_post_thumbnail()) {
		// display the featured image
		$content = the_post_thumbnail() . $content;
	} else {
		// get & set the featured image
		$attachments = get_children(array(
			'post_parent' => $post->ID, 
			'post_status' => 'inherit', 
			'post_type' => 'attachment', 
			'post_mime_type' => 'image', 
			'order' => 'ASC', 
			'orderby' => 'menu_order'
		));
		if ($attachments) {
			foreach ($attachments as $attachment) {
				set_post_thumbnail($post->ID, $attachment->ID);
				break;
			}
			// display the featured image
			$content = the_post_thumbnail() . $content;
		}
	}
	return $content;
}

This code essentially operates the same way as the previous technique, with the exception that we’re filtering the_content while using get_children() instead of get_posts(). Customize as needed and have fun!

Update! You may also be interested in my techniques for displaying all images attached to a post and displaying images with User Submitted Posts. Bonus! :)