Recent Post Slider Widget for Blogger

how to add recent post slider in blogger.com blog It is really simple and you can install it without any html knowledge . You can see it's demo first so that you can decide it is good for your blog or not.

STEPS

1. Goto blogger
2. then in dashboard
3. then go in layout 
4. then add a gadget and select html/javascript
5. now paste the following code in it 

<style>#slide-container {height: 360px;position: relative;width: 480px;}#slider {height: 360px;left: 25px;overflow-x: hidden;overflow-y: hidden;position: relative;width: 480px;font-family: calibri;}.slide-desc {background: transparent url(http://i195.photobucket.com/albums/z105/dantearaujo/darkbg.png) repeat scroll 0 0;color: #FFFFFF;padding: 10px;position: absolute;right: 0px;text-align: left;top: 0;width: 200px;z-index: 99999;}.slide-desc h2 {display: block;}.crosscol .widget-content {position: relative;}#slider ul, #slider li,#slider2 ul, #slider2 li {margin: 0;padding: 0;list-style: none;}#slider2 {margin-top: 1em;}#slider li, #slider2 li {/*define width and height of list item (slide)entire slider area will adjust according to the parameters provided here*/width: 480px;height: 360px;overflow: hidden;}#prevBtn, #nextBtn,#slider1next, #slider1prev {display: block;width: 30px;height: 77px;position: absolute;left: -30px;text-indent: -9999px;top: 71px;z-index: 1000;}#nextBtn, #slider1next {left: 520px !important;}#prevBtn, #nextBtn, #slider1next, #slider1prev {display: block;height: 77px;left: 0;position: absolute;top: 132px;width: 30px;z-index: 1000;}#prevBtn a, #nextBtn a,#slider1next a, #slider1prev a {display: block;position: relative;width: 30px;height: 77px;background: url(http://i195.photobucket.com/albums/z105/dantearaujo/prev.png) no-repeat 0 0;}#nextBtn a, #slider1next a {background: url(http://i195.photobucket.com/albums/z105/dantearaujo/next.png) no-repeat 0 0;}/* numeric controls */ol#controls {margin: 1em 0;padding: 0;height: 28px;}ol#controls li {margin: 0 10px 0 0;padding: 0;float: left;list-style: none;height: 28px;line-height: 28px;}ol#controls li a {float: left;height: 28px;line-height: 28px;border: 1px solid #ccc;background: #DAF3F8;color: #555;padding: 0 10px;text-decoration: none;}ol#controls li.current a {background: #5DC9E1;color: #fff;}ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus {outline: none;}</style>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js' type='text/javascript'></script>
<script src='http://accordion-template.googlecode.com/svn/trunk/easySlider1.7.js' type='text/javascript'></script>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function(){
 $("#slider").easySlider({
 auto: true,
 continuous: true
 });
});
//]]>
</script>
<div id="slider">
<script style="text/javascript" src="http://code.helperblogger.com/easySlider.min.js"></script>
<script style="text/javascript">
 var numposts_gal = 6; var numchars_gal = 150; var random_posts = false; // random posts
</script>
<script src="http://zain-net.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showgalleryposts&max-results=999999"></script>
</div>

• Now replace http://zain-net.blogspot.com with your blog address.
• Adjust it with your need var numposts_gal = 6; var numchars_gal = 150;  

Thank You