Featured Image as Background with Offset

Question

I have a custom Wp_Query in my header that displays the latest post and then a list of 10 posts below which are offset so not to include the recent post.

I want to use the latest post's featured image as the background for the header and I've got it working so it displays an image but it's not the recent post's image, it's the next one in the list which I'm guessing is because of the offset.

Here's the code for the custom loop that displays the recent post in the header:

<?php
        $args = array (
            'type' => 'post',
            'posts_per_page' => '1' );
        $featured_post = new WP_Query( $args );
        if ( $featured_post->have_posts() ) {
        while ( $featured_post->have_posts() ) {
            $featured_post->the_post();
            get_template_part('content-home_header',get_post_format());
        }
        } else {
        // no posts found
        }
    wp_reset_postdata();
?>

This is the div tag that pulls in the featured image as the background:

<div class="header-wrap" style="background-image: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url('<?php echo wp_get_attachment_url( get_post_thumbnail_id($post->ID) ); ?>');">

Essentially I need to display the featured image from the custom loop post but the offset is making it pull in the next post's background image.

Thanks.

Answer 1

Instead of using the tag outside, you can echo the output inside the post loop.

And no need to add the $post ->ID because WordPress will automatically pick up the thumbnail with the wp_get_attachment_url() function.