How to Return the First Image Attachment from the Post as Thumbnail in WordPress

The given code snippet is divided into two parts. The first part defines a new function, namely wpturbo_get_first_post_image() that retrieves the first image from a post’s content and sets it as the post’s thumbnail, while the second part hooks this function into WordPress’s post_thumbnail_html filter.

Let’s delve deeper into the function to understand clearly how it works.

function wpturbo_get_first_post_image() {
    global $post, $posts;
    $first_img = '';
    ob_start();
    ob_end_clean();
    $output = preg_match_all('/<img.+src=['"]([^'"]+)['"].*>/i', $post->post_content, $matches);
    $first_img = $matches [1] [0];

In the function, $post refers to the current post and its properties are available because we declare it as global. We create a new variable named $first_img and initially assign an empty string to it. This will store the URL of our first image or our default image.

Next, we use the ob_start() function to turn on output buffering. This is necessary as we want to capture all the output that will be generated by our regular expression and prevent it from being sent to the browser.

Then the ob_end_clean() function clears the output buffer without sending the output and turns off output buffering. This is to ensure that nothing from the preceding code has been output.

After clearing the output buffer, we use the preg_match_all() function to search the $post->post_content for <img> tags. The regular expression /<img.+src=['"]([^'"]+)['"].*>/i matches and extracts the src attribute (the image URL) from the first image in the post content.

The preg_match_all() function matches all occurrences of the pattern, but we’re only interested in the first image, so we only keep the first match stored in $matches[1][0] and assign it to $first_img.

    if(empty($first_img)){
        $first_img = "/path-to-default.png";
    }
    return $first_img;
}

In the above code, we check if $first_img is empty or not. This checks whether the post has an image or not. If a post doesn’t contain an image, we set $first_img to a default image "/path-to-default.png". You can replace "/path-to-default.png" with the actual path of your default thumbnail. Finally, we return the $first_img.

add_filter( 'post_thumbnail_html', 'wpturbo_get_first_post_image' );

This add_filter function will hook our function into the post_thumbnail_html filter. The WordPress post_thumbnail_html filter modifies the HTML content for the featured image. This makes sure the first image from the post content is returned as the post’s thumbnail.