Recent Posts Widget With Thumbnails For Blogger

Recent posts Widget is Helpful for a Blog to Show the Posts in the Bloe. Specially When Your blog has long Posts to let  your visitors find the Posts Quickly Without Spending more On the Blog By Stucking to the Navigation Menu.Then Displaying a Small Thumbnails Will Make the Widget more Smarter.This not only looks nice, but also entice visitors to click on your posts.



Follow the Below Steps to Add a Recent Posts With Thumbnail Widget For Blogger.

1.Login to Blogger < Page Elements < Add a Gadget < choose Html / Javascript.

2. Now Copy and Paste the Below Code in the Widget 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://www.webaholic.co.in/other/recent-posts-widget-with-images.js'></script>
<script style='text/javascript'>
var numposts = 5;
var showpostthumbnails = true;
var displaymore = true;
var displayseparator = true;
var showcommentnum = true;
var showpostdate = true;
var showpostsummary = true;
var numchars = 100;</script>
<script src='http://www.YOUR-BLOG-URL.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs'></script>
<small><a style='margin-left:10px;align:right;' href='
http://goodinblogging.blogspot.in/2012/06/create-multi-tabbed-widget-for-blogger.html ' target='_blank'>Recent Posts Widget</a> | <a href='http://goodinblogging.blogspot.in/' target='_blank'>GudinBlogging</a></small>
Now Replace Your blog Url With Your Blog Link. And Save the Widget.That's it Now You're Done.

0 comments:

Blogger Template by Clairvo