How To Add Sliding Recent Post Widget for Bloggers Easily

Method to add this in your blog is very simple. Just follow the few steps below.

Sliding Recent Post Widget for Bloggers


Add Animated Recent Posts Widget

Procedure:

• Go to blogger and login to your account.Select your blog.
• Select Layout and then click add a Gadget. Select HTML/Javascript.
• Just copy below code and paste it in that empty field. 

<style type="text/css">
#rp_plus_img{height:377px;}
#rp_plus_img li {height:60px;padding:5px;list-style:none;
background-color:#ffffff;
border:solid 1px #000000;}
#rp_plus_img a{color:#00000;}
#rp_plus_img .news-title{display:block;font-weight:bold ;margin-bottom:4px;font-size:11px;
text-align:justify;
-moz-border-radius: 5px;}
#rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #00000;width:55px;height:55px;}

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script src="https://sites.google.com/site/unwanted86/javascript/recentpost.js" type="text/javascript"></script>
<script type="text/javascript">
var speed = 1500;
var pause = 3500;
$(document).ready(function(){
rpnewsticker();
interval = setInterval(rpnewsticker, pause);
});
</script>
<ul id="rp_plus_img"><script>
var numposts = 5;
var numchars = 0;
</script>  <script src="/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rpthumbnt"></script></ul>

See the Pen Sliding Recent Post Widget for Bloggers by humayun khan (@humayun) on CodePen.
•  Now click on save. Select save arrangement and view your blog.

This is very short and simple tool. You dont need to go anywhere editing your template HTML. I hope you have liked my this tutorial. Don't miss any tutorial. Get subscribed by entering your e-mail address below and confrming it from your inbox. Have a nice day. Thanks