How to Create Recent Posts with Thumbnails in WordPress

There are some plugins for Recent post but i love the coding way.Just paste this code in your side bar.


<h3><?php _e( 'Recent Posts' ); ?></h3>

<?php
$the_query = new WP_Query('showposts=5&orderby=post_date&order=desc');
while ($the_query->have_posts()) : $the_query->the_post();
?>

<div class="latest_post">

<div class="image_holder" >
<?php the_post_thumbnail(array(50,50), array ('class' => 'alignleft')); ?>
</div><!--#image_holder-->

<div class="recent_description">
<h4><a title="<?php the_title(); ?>" href="<?php the_permalink() ?>" rel="bookmark"><?php echo get_the_date('m/d/y'); ?> - <?php the_title(); ?></a></h4>

<?php the_excerpt(); ?>

  </div><!--#recent_description-->
</div><!--#latest_post-->

<?php endwhile; ?>

<?php wp_reset_query(); ?>?

Thats it! You get your cool recent post links with thumbnail.Now if you want to show only 20 word in your description then paste  this code in the function.php of your theme.

function new_excerpt_length($length) {
return 20;
}
add_filter('excerpt_length', 'new_excerpt_length');

Now you can add some css to look it cool.

/* recent post */
.latest_post{float:left;}
.image_holder{ float:left; width: 80px;}
.recent_description{
float: left;
padding: 5px;
}
1 reply
  1. khanh
    khanh says:

    Great great tutorial. Thank so much! But I have a question: after add recent posts widget into sidebar, the recent posts list show 2 times, one with thumbnail and another one is standard list. How to remove the 2.list? And another question: How can I limit the number of posts to show?

    Reply

Leave a Reply

Want to join the discussion?
Feel free to contribute!

Leave a Reply