WordPress featured image as div background image

1 Views

How can I set the featured images on all my posts to be outputted as a background image to a div. For example 

<div class="postimg" style="background-image:url('https://s3.amazonaws.com/ooomf-com-files/8jLdwLg6TLKIQfJcZgDb_Freedom_5.jpg')"></div>

Currently the featured image is being outputted as a regular image using this helper <?php the_post_thumbnail( 'wpbs-featured' ); ?>

Post Views: 1

Related posts

Leave a Reply

3 comments

  1. I would suggest simply something along the lines of this
    Get post featured image URL and echo it out accordingly:

    <?php
$img = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), "full");
$img = $img[0];
?>
<div class="postimg" style="<?php if($img){echo 'background:url('.$img.');';} ?>">

</div>

  3. Try this…

    <?php if (has_post_thumbnail( $post->ID ) ): ?>
<?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' ); ?>
<div id="custom-bg" style="background-image: url('<?php echo $image[0]; ?>')">

</div>
<?php endif; ?>