How To Add Scrolling Recent Post Gadget

This Recent Posts widget shows the list of most  Recent posts on your blog along with an image thumbnail of the post,Just Follow The simple Steps:

      Step 1:  Login to Blogger

 ->>Go to Blogger Dashboard >> Template >> Edit HTML 

->>Press Ctrl+F and search the code shown below    

               </head> 

->>Now Paste this Code  Shown  Below just


above/before it

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>

Step 2 :

• ->>Login in to Blogger Dashboard 
•  ->>Then Click “Add Gadget” 
  

     

  ->>After that select Gadget “Add Gadget” again and select “HTML/Javascript”

•  ->>copy This HTML to Add gadget

<style type="text/css" media="screen"> <!-- /* ==== Scrolling Recent Posts Widget By INSECURESPOT ===== */ #spylist { overflow:hidden; margin-top:4px; padding:0px 0px; height:400px; } #spylist ul{ width:300px; overflow:hidden; list-style-type: none; padding: 0px 0px; margin:0px 0px; } #spylist li { width:295px; padding: 5px 5px; margin:0px 0px 5px 0px; list-style-type:none; float:none; height:85px; overflow: hidden; background: #000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6DPOzduSuMKzMwrCsdiEvVPrBlOUERd633_xdqmXZnYaqxSwiAgRdGvJW_V68Sr80r11dX9y9oHtae7_HMgCthJbkz0qKjYvh5MymF57uoJ3DiK5aTZj7sdlGC8JLDWr4nM9EStt_5p4/s1600/helperblogger.com-post.jpg) repeat-x; border: 1px solid #ddd; } #spylist li a { text-decoration:none; color:#000; font-size:12px; height:17px; overflow:hidden; margin:0px 0px; padding:0px 0px 2px 0px; } #spylist li img { float:left; margin-right:5px; background:#f4eeee; border:0; } #spylist img { float: left; margin-top: 10px; margin-right: 15px; background: #EFEFEF; border: 0; } #spylist img { -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; padding: 4px; background: #eee; background: -webkit-gradient(linear, left top, left bottom, from(#eee), color-stop(0.5, #ddd), color-stop(0.5, #c0c0c0), to(#aaa)); background: -moz-linear-gradient(top, #eee, #ddd 50%, #c0c0c0 50%, #aaa); -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: 0 0 3px rgba(0,0,0,.7); -moz-box-shadow: 0 0 3px rgba(0,0,0,.7); box-shadow: 0 0 3px rgba(0,0,0,.7); } #spylist img:hover { -moz-transform: scale(1.2) rotate(-350deg); -webkit-transform: scale(1.2) rotate(-350deg); -o-transform: scale(1.2) rotate(-350deg); -ms-transform: scale(1.2) rotate(-350deg); transform: scale(1.2) rotate(-350deg); -webkit-box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1); -moz-box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1); box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1); } .spydate{ overflow:hidden; font-size:11px; color:#007cb5; padding: 3px 0px; margin:1px 0px 0px 0px; height:15px; font-family:Tahoma,Arial,sans-serif; } .spycomment{ overflow:hidden; font-family:Tahoma,Arial,verdana, sans-serif; font-size:9px; color:#272b2e; padding:2px 0px; margin:0px 0px; } /* ==== Scrolling Recent Posts Widget By INSECURESPOT ===== */ --> </style> <script language='JavaScript'> imgr = new Array(); imgr[0] = "https://lh5.googleusercontent.com/-jpWYcHExk_o/UUVu-TKOXeI/AAAAAAAABA0/jN2dyzOde10/h120/noimage.png"; imgr[1] = "https://lh5.googleusercontent.com/-jpWYcHExk_o/UUVu-TKOXeI/AAAAAAAABA0/jN2dyzOde10/h120/noimage.png"; imgr[2] = "https://lh5.googleusercontent.com/-jpWYcHExk_o/UUVu-TKOXeI/AAAAAAAABA0/jN2dyzOde10/h120/noimage.png"; imgr[3] = "https://lh5.googleusercontent.com/-jpWYcHExk_o/UUVu-TKOXeI/AAAAAAAABA0/jN2dyzOde10/h120/noimage.png"; imgr[4] = "https://lh5.googleusercontent.com/-jpWYcHExk_o/UUVu-TKOXeI/AAAAAAAABA0/jN2dyzOde10/h120/noimage.png"; showRandomImg = true; boxwidth = 300; cellspacing = 5; borderColor = "#232c35"; bgTD = "#000000"; thumbwidth = 69; thumbheight = 72; fntsize = 13; acolor = "#555"; aBold = false; icon = " "; text = "comments"; showPostDate =true; summaryPost = 39; summaryFontsize = 9; summaryColor = "#555"; icon2 = " "; numposts = 12; home_page = " http://YOURBLOGNAME //"; limitspy=7; intervalspy=3000 </script> <div id="spylist"> <script src='https://googledrive.com/host/0B_1mqJd2tC8qLUJMTGZqTE1qTUU' type='text/javascript'></script> </div>

Step 3:NOW Now replace INSECURESPOT with your Blog Name

Step 4: THATS IT..NOW SAVE AND PREVIEW YOUR TEMPLATE:))