Cara Membuat Recent Post Tanpa Gambar Bergerak Ke Atas

Membuat Recent Post Bergerak - Recent post adalah beberapa artikel artikel terbaru yang kita tulis dalam sebuah blog maupun website. Kalau untuk blogspot sendiri tidak ada recent post bawaan, jadi kita harus menambahkan sendiri kode untuk menampilkan recent post dalam blog kita. Untuk membuat recent post ada beberapa cara, ada yang disertai gambar dan ada pula yang tanpa gambar.

Disini saya akan berbagi cara membuat recent post tanpa gambar. Fungsi recent post sendiri menurut saya adalah untuk memudahkan pengunjung melihat artikel apa saja yang sudah kita posting dalam beberapa hari terakhir ataupun dalam hari ini, dengan catatan pemasangan recent post harus strategis. Disamping itu, recent post juga akan membuat blog kita terlihat lebih cantik dan rapi. Apalagi recent post yang kita pasang bisa bergerak sendiri.

Membuat Recent Post Tanpa Gambar Bergerak Ke Atas Dengan Widget

1. Login ke akun blogger kalian

2. Pilih tata letak

3. Tambahkan Widget HTML/JavaScript

4. Lalu copy paste kode di bawah ini

<br />
<style type="text/css">
    ul { list-style-image: url(http://img375.imageshack.us/img375/2936/flower.png) }
    ul a{text-decoration:none;}
    ul a:hover {background:#66FF00; text-decoration:none; color: red;"}
    </style><br />
<marquee behavior="scroll" direction="up" scrollamount="2" onmouseover="this.stop()" onmouseout="this.start()"><br />
<script>
    function rp(json) {
    document.write('<ul>');
    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);
    var readmorelink = "(more)";
    readmorelink = readmorelink.link(posturl);
    var postdate = entry.published.$t;
    var cdyear = postdate.substring(0,4);
    var cdmonth = postdate.substring(5,7);
    var cdday = postdate.substring(8,10);
    var monthnames = new Array();
    monthnames[1] = "Jan";
    monthnames[2] = "Feb";
    monthnames[3] = "Mar";
    monthnames[4] = "Apr";
    monthnames[5] = "May";
    monthnames[6] = "Jun";
    monthnames[7] = "Jul";
    monthnames[8] = "Aug";
    monthnames[9] = "Sep";
    monthnames[10] = "Oct";
    monthnames[11] = "Nov";
    monthnames[12] = "Dec";
    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, "");
    document.write(posttitle);
    if (showpostdate == true) document.write(' - ' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday);
    if (showpostsummary == true) {
    if (postcontent.length < numchars) {
    document.write(postcontent);
    } else {
    postcontent = postcontent.substring(0, numchars);
    var quoteEnd = postcontent.lastIndexOf(" ");
    postcontent = postcontent.substring(0,quoteEnd);
    document.write(postcontent + '...' + readmorelink);
    }
    }
    document.write('</li>
');
    }
    document.write('</ul>
');
    }
    </script><br />
<script>
    var numposts = 15;
    var showpostdate = false;
    var showpostsummary = false;
    var numchars = 100;
    </script><br />
<script src="http://kios-tutorial.tk/feeds/posts/default?orderby=published&alt=json-in-script&callback=rp"></script></marquee><br />

Note !
- Ganti angka 15 pada var numposts dibagian bawah untuk menampilkan berapa banyak jumlah postingan yang akan di tampilkan
- Ganti http://kios-tutorial.tk dibagian bawah dengan URL blog kalian

5. Lalu SAVE dan lihat hasilnya.

Bagaimana mudah bukan, blog kalian sekarang sudah terlihat indah dan rapi. Sampai jumpa pada tutorial-tutorial berikutnya. Jangan lupa untuk membaca Membuat Recent Post Bergambar Bergerak Ke Bawah

Terima kasih sudah berkunjung dan meluangkan waktu untuk membaca artikel