Generate Background for Each Post With WordPress Thumbnail

1 Views

I have a website that i’m working on where I need to generate a unique image in header.php for each individual post.

I have this in my index.php:

Read More
 $pageposts = $wpdb->get_results($querystr, OBJECT);
 foreach($pageposts as $ppost){
$ID = $ppost->post_id;
$title = get_the_title( $ID ); 
$thumb = wp_get_attachment_image_src( get_post_thumbnail_id( $ID ), 'single_post_thumbnail' );
$t = $thumb[0];
$desc = get_post($ID)->post_content;
$out = get_post_meta($ID,'outbound',true);
$output = "
<div class='ph-sticky' id='phf'>
<span class='icon-x'><i class='fa fa-times icon-xy'></i></span>
<div class='row hunt-row-fp'>
<a class='title' href='$out' target='_blank' rel='nofollow'>$title</a>
<div class='img-featured'><img class='phsi' src='$t'/></div>
<span class='description'>$desc</span>
</div>
</div>";    
 }

 echo $output;
 wp_reset_query();
?>

This correctly generates a thumbnail for each post, however in my header.php my code only generates the image of the FIRST post on the page. Here it is: 

<!-- post modal -->
<div class="show-post-modal">  

<?php if (has_post_thumbnail( $post->ID ) ): ?>
<?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'large' ); ?>
<div class="comments-bg-image" style="background-image: url('<?php echo $image[0]; ?>')" >
</div>
<?php endif; ?>

<div class="comments-header">

I’ve tried multiple solutions however I can only seem to pull in the first thumbnail, which becomes the background for all posts. Any help would be most appreciated!

Post Views: 1

Related posts

1 comment

  1. i think this will help you a lot.

    <?php 
$page = get_post($post->ID);
$post_thumbnail_id = get_post_thumbnail_id( $post->ID );
if(!empty($post_thumbnail_id)) {
$img_ar =  wp_get_attachment_image_src( $post_thumbnail_id, 'full' );?>
<style>
.comments-bg-image{ background-image: url(<?php echo $img_ar[0];?>);  }
</style>
<?php } ?>

Comments are closed.