Show featured images as inside-article background on blog archives

Hi there,

You'd likely need to create a custom page template in order to do that, unfortunately. Without doing that, you'd need to re-query the posts in wp_head and loop through them to create CSS for each individual post.

From a simplicity/performance standpoint, the custom template is the way to go.

For example, copy content.php and add it to your child theme.

Then, right above <article>, do this:

<?php
$image = get_the_post_thumbnail_url( get_the_ID() );
$background_css = '';

if ( $image ) {
    $background_css = 'style="background-image: url( ' . $image . ' );"';
}
?>

Then you'd add $background_css to the <article> element.

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?> <?php generate_do_microdata( 'article' ); ?> <?php echo $background_css; ?>>

Great, I'll give that a go. But thinking about it, wouldn't this be a better thing to do with your WP Show Posts plugin?

I tried your solution and I found the columns hard to control, specifically no margin between them and adding a margin messes up the layout.

http://hotelutopia.pash.space/category/attractions/

Try applying the image to the .inside-article element instead.

Great, yes, of course, thanks!

You're welcome :)