Recent Post Widget with Thumbnails for Blogger

A recent post widget can be much helpful for your blog visitors to find latest posts among large number of posts. It also increases your blog pageviews. Here, I will show you how to add a recent post widget with thumbnails, post titles and summaries options. Thumbnails attracts your visitors to click on the post titles. You can use a customized thumbnails for the post without thumbnails. This widget is fully customisable. You can display or close any option according to your wish.

Procedure to add recent post widget with thumbnails for blogger:

Step-1: Go to your Blogger Dashboard >> Layout >> Add a Gadget

Step-2: From the pop-up window choose HTML/JavaScript

Step-3: Now copy and paste the below code inside the box.

<style type='text/css'>
img.recent_thumb {padding:1px;width:55px;height:55px;border:0;
float:left;margin:10px;}
.recent_posts_with_thumbs {float: left;width: 100%;min-height: 70px;margin: 5px 0px 5px 0px;padding: 0;font-size:12px;}
ul.recent_posts_with_thumbs li {padding-bottom:5px;padding-top:5px;min-height:65px;}
.recent_posts_with_thumbs a {text-decoration:none;}
.recent_posts_with_thumbs strong {font-size:10px;}</style>
<script style='text/javascript' src='http://yourjavascript.com/1159358112/www.mybloggertopic.blogspot.com.js'></script>
<script style='text/javascript'>
var numposts = 5;
var showpostthumbnails = true;
var displaymore = false;
var displayseparator = true;
var showcommentnum = true;
var showpostdate = true;
var showpostsummary = true;
var numchars = 100;</script>
<script src='/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs'></script>
<hr/><small><a style='margin-left:10px;align:right;' href='http://www.techweb24.com/2014/06/recent-post-widget-with-thumbnails-for.html' target='_blank'>Recent Posts Widget</a></small>

Customization:

• Change numposts = 5 to Show number of Recent posts with thumbnails
• Change numchars = 100 to number of characters to show in summary of recent posts
• Change true to false to activate or deactivate any feature of this widget

Finally click on save. Enjoy :)

• Tweet
• Share
• Share
• Share
• Share

Sign up here with your email