Wordpress Featured Image Not Displaying

Question

I am trying to show a small version of the featured image as a post thumbnail on my main page (index.php). For this I am implementing it as the background-image of a div. Unfortunately the code (which had been working before) has stopped working now and I cannot find a reason why. I have been looking everywhere for a solution, but I just cant figure it out. I am using the following code but unfortunately it doesnt return anything:

<?php $post_image_id = get_post_thumbnail_id($post_to_use->ID);
if ($post_image_id) {
$thumbnail = wp_get_attachment_image_src( $post_image_id, 'post-thumbnail', false);
if ($thumbnail) (string)$thumbnail = $thumbnail[0];
} ?>

<?php if (has_post_thumbnail()) : ?>
<div class="post_image_crop" style="background: url('<?php echo $thumbnail; ?>')">
</div>
<?php endif; ?>

You can have a look at it here: oliverprenzel.com

The weird thing is, I have done exactly the same thing on my single.php where it still does work.

<?php $post_image_id = get_post_thumbnail_id($post_to_use->ID);
if ($post_image_id) {
$thumbnail = wp_get_attachment_image_src( $post_image_id, 'post-thumbnail', false);
if ($thumbnail) (string)$thumbnail = $thumbnail[0];
} ?>

<?php if (has_post_thumbnail()) : ?>
<div class="post_image_bg" style="background: url('<?php echo $thumbnail; ?>'); background-size: 100% !important;">
</div>
<?php endif; ?>

You can have a look at it working here: oliverprenzel.com/headmagazine/

Does anyone have an idea what might be causing this?

Edit for Claudiu: This is the loop I am trying to get the image in:

<div class="wrapper">
<?php $post_image_id = get_post_thumbnail_id( $post_id );
    if ($post_image_id) {
        $thumbnail = wp_get_attachment_image_src( $post_image_id, 'post-thumbnail', false);
        if ($thumbnail) (string)$thumbnail = $thumbnail[0];
    } ?>
<!-- post loop prev -->
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<a href="<?php the_permalink() ?>">
    <div class="post_frame">
        <div class="post_image_crop" style="background: url('<?php echo $thumbnail; ?>')">
        </div>
        <div class="prev_det">
            <div class="prev_det_center">
                <h1>
                    <?php the_title(); ?>
                </h1>
                <p><?php echo get_the_category_list(', '); ?></p>
            </div>
        </div>
        <div class="prev_det_fold"></div>
    </div>
</a>
<?php endwhile; ?>
<?php else: ?>
<?php endif; ?>
</div>

chyupa chyupa · Accepted Answer · 2015-06-12T08:45:34

If you want to get each posts thumbnail, then you need to move

<?php $post_image_id = get_post_thumbnail_id( $post_id );
    if ($post_image_id) {
        $thumbnail = wp_get_attachment_image_src( $post_image_id, 'post-thumbnail', false);
        if ($thumbnail) (string)$thumbnail = $thumbnail[0];
    } ?>

inside the loop and change it to:

<?php $post_image_id = get_post_thumbnail_id( get_the_ID() );
    if ($post_image_id) {
        $thumbnail = wp_get_attachment_image_src( $post_image_id, 'post-thumbnail', false);
        if ($thumbnail) (string)$thumbnail = $thumbnail[0];
    } ?>

My guess is that $post_image_id is returning null because you don't have a featured image for your home page and even if you had, the same image will be displayed for each post.

Wordpress Featured Image Not Displaying

2 Answers