not quite clear:
do you want to edit the front-page.php or the blog.php?
do you want those three divs in addition to what is already there?
what theme are you working with?
you will need to work with:
https://codex.wordpress.org/Class_Reference/WP_Query
https://codex.wordpress.org/The_Loop
https://wordpress.org/support/topic/retrieveing-featured-image-url?replies=12
general code idea:
<?php
$args = array( //get three latest posts with featured image
'posts_per_page' => 3,
'meta_key' => '_thumbnail_id'
);
$three_recent = new WP_Query( $args );
if( $three_recent ->have_posts() ) :
while( $three_recent ->have_posts() ) :
$three_recent ->the_post();
$image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ) ); ?>
<div class="three-recent-posts trp-<?php echo $three_recent->current_post+1; ?>" style="background-image: url('<?php echo $image[0]; ?>'); float: left; height: 200px; width: 33.3%; ">
</div><!--/. three-recent-posts -->
<?php endwhile; endif; wp_reset_postdata(); ?>
will need some formatting….
Thread Starter
Eric
(@goodeum)
Michael,
Thanks for the quick reply, and sorry for the lack of info. I am editing the front-page.php to retrieve the featured images from the blog.php. I am creating my own theme, and decently new to WP. I want the three divs to be able to be styled differently, so as this works great, I’m not sure how to style say the most recent post differently than the second to most previous etc. I’ve incorporated Bootstrap to the theme, so I’m wanting to use diff col- styled divs for the different images. For instance, make the most recent post into a col-md-8 and the second and third into a col-md-4. So your code is great, and it gets the right images, just not sure how to style them differently as it only calls for one div in the code. Please let me know if that makes sense, or if you’d like more info. I’m working all on a local setup, so I really don’t want to upload it all to be able to go through, so sorry if that’s an inconvenience. Again, thank you!
For instance, make the most recent post into a col-md-8 and the second and third into a col-md-4.
try to replace this line:
<div class="three-recent-posts trp-<?php echo $three_recent->current_post+1; ?>" style="background-image: url('<?php echo $image[0]; ?>'); float: left; height: 200px; width: 33.3%; ">
with:
<div class="three-recent-posts col-md-<?php echo ($three_recent->current_post==0?'8':'4'); ?>" style="background-image: url('<?php echo $image[0]; ?>'); height: 200px;">
Thread Starter
Eric
(@goodeum)
You are the man. Thank you so much for fixing something I’ve spent so long trying to figure out. It needed a tiny bit of tweaking from what you gave me, but I could figure it out easy enough and it works amazingly now, can’t tell you thanks enough!
