Display recent posts with thumbnail within Masonry

3 Views

On a page-template, I need to display recent 10 posts. So I tried to use, wp_get_recent_posts, found here in the codex, which I think is an appropriate hook for the purpose.The rest of the code is from my archive.php which displays the post-thumbnails in masonry just fine. I simply would like to achieve the same thing with the recent posts. This is what my code looks like : 

<?php 
/* 
Template Name: Recent Profiles 
*/          
get_header(); 
?>

<h1 class="page-title"><?php the_title(); ?></h1>    

<div id="content">
<div id="masonry">


<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

<div class="item normal" data-order='1'><!--BEGIN .item --> 
<div <?php post_class(); ?> id="featured-<?php the_ID(); ?>"><!--BEGIN .hentry -->





<?php
    $args = array( 'numberposts' => '10' );
    $recent_posts = wp_get_recent_posts( $args );
    foreach( $recent_posts as $recent ) {
    if ( has_post_thumbnail($recent["ID"])) {    
        echo '<a href="' . get_permalink($recent["ID"]). '">';
        echo get_the_post_thumbnail($recent["ID"], 'archive_grid');
        echo '</a>';
    }
}
?>





</div><!--END .hentry-->  
</div><!--END .item -->

<?php endwhile; endif; ?>

<?php get_template_part('includes/index-loadmore'); ?>

</div><!--END #masonry -->
<div id="masonry-new"></div>

<!--BEGIN .post-navigation -->
        <div class="post-navigation clearfix">
            <?php dt_pagination(); ?>
        <!--END .post-navigation -->
        </div>

    </div><!-- #content -->

<?php get_footer(); ?>

Issue : The issue is, the code is just displaying one recent post thumbnail instead of the expected 10. Please help me out for what I might be missing here. Perhaps something wrong with the loop. FYI archive_grid is the name of the custom thumbnail.

Post Views: 3

Related posts

2 comments

  1. Add the meta_key parameter to fetch the latest posts which have featured image set. $args = array( 'numberposts' => '10', 'meta_key' => '_thumbnail_id' );

    <?php
/* 
Template Name: Recent Profiles 
*/
get_header();
?>
<h1 class="page-title"><?php the_title(); ?></h1>

    <div id="content">
        <div id="masonry">
            <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
                <div class="item normal" data-order='1'><!--BEGIN .item -->
                    <div <?php post_class(); ?> id="featured-<?php the_ID(); ?>"><!--BEGIN .hentry -->
                        <?php
                        $args = array( 'numberposts' => '10', 'meta_key' => '_thumbnail_id' );
                        $recent_posts = wp_get_recent_posts( $args );
                        foreach ( $recent_posts as $recent ) {
                            if ( has_post_thumbnail( $recent["ID"] ) ) {
                                echo '<a href="' . get_permalink( $recent["ID"] ) . '">';
                                echo get_the_post_thumbnail( $recent["ID"], 'archive_grid' );
                                echo '</a>';
                            }
                        }
                        ?>
                    </div>
                    <!--END .hentry-->
                </div><!--END .item -->
            <?php endwhile; endif; ?>
            <?php get_template_part( 'includes/index-loadmore' ); ?>
        </div>
        <!--END #masonry -->
        <div id="masonry-new"></div>
        <!--BEGIN .post-navigation -->
        <div class="post-navigation clearfix">
            <?php dt_pagination(); ?>
            <!--END .post-navigation -->
        </div>
    </div><!-- #content -->
<?php get_footer(); ?>

Comments are closed.