How To Add Auto Scroll Recent Post Widget To Your Blogger

Blogger default recent post widget is boring for all Blog users. This is new stylish auto scrolling recent post widget. Install it,  and leave a comment below.

 

 

 

Log in to your Blogger account.

 

• Go to Layout.

 

• Select Add a Gadget.

 

• Select HTML / Javascript.

 

• Copy and Paste the codes below:

 

<style>img.recent_thumb {padding:1px;width:55px;height:55px;border:0;float:right;margin:0 0 5px 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> <span id="preserve1fcbe8565c3e4bd19e9aeb8a80c08885" class="wlWriterPreserve"><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"> </script></span> <span id="preserve7fc52372c7eb4ae0803a0a906dbda177" class="wlWriterPreserve"><script style='text/javascript' src="http://stylifyyourblog1.googlecode.com/svn/trunk/recentpostticker.js" > </script></span> <span id="preserve869ebc45c67b4727807ab7d482ca2134" class="wlWriterPreserve"><script style='text/javascript'src='http://tavristasos.googlecode.com/svn- history/r100/trunk/recentpostswiththumbnailsv3.js'></script></span> <span id="preserve949aaf464c464714898f7f2702751fb3" class="wlWriterPreserve"><script style='text/javascript'> var numposts = 20; var showpostthumbnails = true; var displaymore = true; var displayseparator = false; var showcommentnum = false; var showpostdate = true; var showpostsummary = true; var numchars = 50; $(document).ready(function () {$('#sai').vTicker({ speed: 550, pause: 5500, showItems: 4, animation: 'fade', mousePause: true, height: 0, direction: 'up' });}); </script></span> <div id="sai"> <span id="preserve4025099dd4a04a3eaf69d292e45a176f" class="wlWriterPreserve"><script src='http://YOUR BLOG.blogspot.com/feeds/posts/default? orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs'> </script></span> </div>

 

 

Find (Ctrl+F) and Change Red Color values.Make your Widget better.

var numposts = 20;

 

var showpostthumbnails = true;

var displaymore = true;

 

var showpostdate = true;

var showpostsummary = true;

speed: 550,

pause: 5500,

showItems: 4,

 

mousePause: true,

direction: 'up'

<script src='http://YOUR BLOG.blogspot.com/feeds/posts/default?

 

• Save Widget .

 

 

 

 

Leave your comments below……………

Posted in: Blogs and Websites