New Stylish Recent Posts widget for Blog

New Stylish Recent Posts widget for Blog Sidebar Widgets

Add a New Recent posts widget that adds a nice appearance to your blog/website.

This Plugin/Widget is a automatic numbered and displays date of your posts published and the author name, and post title with post excerpt i.e little description shown in the above image.

For Live Demo see below image of New stylish recent posts widget for blog.

To add this to your blog just follow the below steps

Go to Blogger Dashboard >> Select Layout >> Select Add a Gadget

Now select HTML/JAVASCRIPT as shown below

Now Copy the below code and paste the following code in below shown box and Click Save.

<div class="recentpoststyle">
<script src="http://goo.gl/JI3Hml"></script>
<script>
var posts_no = 3;var posts_date = true;var post_summary = true;var summary_chars = 90;</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showlatestposts">
</script>
<style type="text/css">
.recentpoststyle {
counter-reset: countposts;
list-style-type: none;
}
.recentpoststyle a {
text-decoration: none;
color: #0080ff;
}
.recentpoststyle a:hover {
color: #db4437;
}
.recentpoststyle li:before {
content: counter(countposts,decimal);
counter-increment: countposts;
float: left;
z-index: 2;
position: relative;
font-size: 20px;
font-weight: bold;
color: #ffffff;
background: #666;
margin: 10px 5px 0px -4px;
padding: 0px 10px;
border-radius: 100%;
}
li.recent-post-title {
padding: 7px 0px;
}
.recent-post-title {
font-family: "book antiqua";
}
.recent-post-title a {
color: #666;
font-size: 14px;
text-decoration: none;
padding: 2px;
font-weight: bold;
}
.post-date {
padding: 5px 2px 5px 30px;
font-size: 11px;
color: #6d6e72;
margin-bottom: 5px;
}
.recent-post-summ {
border-left: 1px solid #69B7E2;
color: #777;
padding: 0px 5px 0px 20px;
margin-left: 11px;
font-family: Garamond,Baskerville,"Baskerville Old Face","Hoefler Text","Times New Roman",serif;
font-size: 15px;
}
</style></div>
<div align = 'left'><a href="http://btctrickz.blogspot.in/2015/06/new-stylish-recent-posts-widget-for-blog.html"><img alt="Get this widget to your blog" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_Nb7SIZG2tw1st0dNv1xVLVYYOLbGkWYdqU06cjDsuMCdUiyBwzDWKDdeCShoeXrlJGaQIZa3XvdHnI33yAgPrrF3M8mCFEW-UTv10ct93Up4vG3tca4iFJ9M_wOuvzwJZzjOaEzwV7wr/h54/gethiswidgetnew1.png" width="100px" height="20px" style="border:0;" /></a></div>