Cara Membuat Recent Post Dengan Scrool Box

Musttrie - Cara membuat Recent Post dengan Scrool Box. Recent Post dengan Scrool Box bisa dibuat secara fleksibel dan disesuaikan dengan ukuran widget blog anda. Anda dapat mengubah lebar dan tinggi sesuai keinginan. Recent Post dengan Scrool Box merupakan cara yang lebih simple untuk menampilkan postingan baru yang diterbitkan secara otomatis. Sementara Scrool Box juga akan menghemat tempat di widget anda plus membuat tampilan blog anda lumayan keren. Andapun juga bisa mengedit untuk ukurannya, misal width:500px, height:250px, var numposts = 1000 sesuai kebutuhan. Nah, untuk lebih jelasnya, kode javascript yang diperlukan bisa anda dapatkan di bawah ini.  Berikut, tips cara membuat Recent Post dengan Scrool Box.



Cara Membuat Recent Post Dengan Scrool Box:

- Masuk ke dashboard blogger anda
- Buka > Tata letak >  Add Gadget (Tambah Gadget).
- Pilih > HTML/Javascript.
- Copy paste kode HTML dan Javascript dibawah ini, di dalam box



<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-ANDA/feeds/posts/default?orderby=published&alt=json-in-script&max-results=999&callback=showrecentposts"></script>
</div>
</div></div>


- Klik > Simpan


*******
Anda perlu mengganti kode diatas seperti cara berikut:
Image-1, ganti dengan: http://i49.tinypic.com/27ziu80/gubhugreyot/images/bgRPli.gif
URL-BlOG-ANDA: ganti dengan URL blog milik anda

Untuk memperlebar ruang judul posting, anda bisa rubah width:500px; height:250px; margin-left:-40px; dengan nilai yang lebih besar. Silahkan anda cek/lihat terlebih dahulu hasilnya, sebelum merubah ukuran
Demikian  tips kali ini, cara membuat Recent Post dengan Scrool Box, semoga bermanfaat.