Membuat Widget Recent Post dengan scrollBar Js

Assalamualaikum wr.wb,Hai para sharelikers,ketemu lagi sama artikel tutorial ya?nah kali ini saya akan share tentang widget Recent Post dengan scroll bar,Nah mau tahu kan caranya?nah kalau mau tahu oke ikuti saja langkah-langkah nya berikut ini.

Langkah-langkah Membuat recent post dengan Scroll :

1. Loggin ke blogger,
2. Pas di Dasboard,click Rancangan
3. Lalu click Add gadget di TATA LETAK 
4. Pilih Gadget untuk JAVASCRIPT /HTML 
5. Nah lalu copy pastekan kode berikut ini didalam nya
   
   <style type="text/css">
   .daftar_posting{list-style:none;margin-left:-20px;font-family:Droid Serif;font-size:16px;color:lime;text-align:left;}
   .daftar_posting a{color:yellow;border-top:1px dotted blue;border-bottom:1px dotted blue;background:transparent url(url gambar anda) no-repeat 0 50%;padding-left:15px;}
   .daftar_posting a:hover{color:red;}
   </style>
   <div style="margin:2px; padding:4px;border:2px solid #888;background:#333;">
   <div style="border:2px solid #444;overflow:auto;padding:4px;background:#111;height:250px;">
   <div style="width:300px;">
   <script style="text/javascript">
   var numposts = 1000;
   var showpostsummary = false;
   var standardstyling = true;
   function showrecentposts(json) {document.write('<ol class="daftar_posting">');
   for (var i = 0; i < numposts; i++) { document.write('<li>');
   var entry = json.feed.entry[i]; var posttitle = entry.title.$t;
   var posturl; if (i == json.feed.entry.length) break;
   for (var k = 0; k < entry.link.length; k++) {
   if (entry.link[k].rel == 'alternate') {posturl = entry.link[k].href; break;}}
   posttitle = posttitle.link(posturl);
   if ("content" in entry) { var postcontent = entry.content.$t;}
   else
   if ("summary" in entry) { var postcontent = entry.summary.$t;}
   else var postcontent = ""; var re = /<\S[^>]*>/g;
   postcontent = postcontent.replace(re, "");
   if (!standardstyling) document.write('<div class="bbrecpost">');
   if (standardstyling) document.write(posttitle);
   if (!standardstyling) document.write('</div><div class="bbrecpostsum"">');
   if (showpostsummary == true) { if (standardstyling) document.write('<br/>');
   if (postcontent.length < numchars) { if (standardstyling) document.write('<i>');
   document.write(postcontent); if (standardstyling) document.write('</i>');}
   else { if (standardstyling) document.write('<i>');
   postcontent = postcontent.substring(0, numchars); var quoteEnd = postcontent.lastIndexOf(" ");
   if (standardstyling) document.write('</i>');}}
   if (!standardstyling) document.write('</div>'); if (standardstyling) document.write('<br/>');
   document.write('</li>');}
   document.write('</ol>');
   if (!standardstyling) document.write('<div class="bbwidgetfooter">');
   if (standardstyling) document.write('<br/>');}
   </script>
   <script src="URL BLOG KAMU/feeds/posts/default?orderby=published&alt=json-in-script&max-results=999&callback=showrecentposts"></script>
   </div>
   </div>
   </div>

6.Click Save
7.Nah sekarang Widget mu sudah jadi,tinggal kamu atur letaknya dimana kamu mau ya!

Catatan :
Oh ya hampir lupa ,liat pada kode,

1.yang warna Biru itu adalah kode Url gambarmu,bila kamu males mencari ni saya
   kasih urlnya tinggal dipilih yang kamu sukai.

• http://i1102.photobucket.com/albums/g456/yangpentingshare/sideicon.gif
• http://community.m-files.com/Themes/core/images/staradmin.gif
• http://sinorefine-sh.com/img/side_icon.jpg
• http://icons.iconarchive.com/icons/dsigns4us/canon/16/1100d-side-icon.png
• http://www.veryicon.com/icon/16/System/SNOW.E%202%20XP/Games%208%20Ball.png

2.Untuk Tulisan "url Blog Kamu",Ukuran width,Margin serta Height dapat
   Kamu sesuaikan dengan Kebutuhan Blog mu.Selamat Mencoba(Sumber)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~