Membuat Recent Posts Rapi dg Scroll

Setelah saya mencoba tutorial ini hasilnya benar-benar membuat judul postingan saya jadi bagus dan rapi. kini saya ulaskan kepada sobat-sobat sekalian tentang cara Membuat recent posts dg rapi beserta scroller boxnya...
Ikuti Langkahku ini brow : 
Login ke Blogger
Klik Rancangan → Edit HTML→ Elemen Laman → Tambah Gadget →HTML/JavaScript 
Lalu sobat Copy kode dibawah ini :

<style type="text/css">
.daftar_posting{list-style:none;margin-left:-40px;font-family:Droid Serif;font-size:11px;color:lime;text-align:left;}
.daftar_posting a{color:yellow;border-top:1px dotted blue;border-bottom:1px dotted blue;background:transparent url(image-1) 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:500px;">
<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/feeds/posts/default?orderby=published&alt=json-in-script&max-results=999&callback=showrecentposts"></script>
</div>
</div>
</div>

WARNING !

Kode yang harus sobat ganti :

1. Ganti kode yang berwarna merah sebelum Kode HTML dan Javascript di pasang :
   - Image-1, silahkan ganti dengan :
   » http://i49.tinypic.com/27ziu80/gubhugreyot/images/bgRPli.gif
   - URL BLOG dengan URL blog sampeyan. Misalnya :
   »http://www.abdu-green.blogspot.com
2. Apabila ruang untuk teks judul posting kurang lebar, silahkan rubahwidth:500px; dengan nilai yang lebih besar. Perubahan pada kode ini mungkin hanya perlu dilakukan ketika semua sudah terpasang dan setelah terlihat hasilnya memang sangat diperlukan untuk diperbesar. Lebar 500px sepertinya sudah mencukupi untuk sebuah judul posting.
3. Untuk merubah tinggi scroller, lakukan pada :
   - height:250px;
4. Apabila daftar poting terlalu di sebelah kiri (tanda panah menghilang/terpotong), kurangi nilai pada kode :
   - margin-left:-40px;

Save/simpan dan lihat perubahannya .....

sumber :http://valkenxxx.blogspot.com