Pada kesempatan kali ini kita akan membahas tentang Bagaimana Membuat Artikel Terbaru Dengan Efek Berjalan seperti yang terdapat pada blog ini. Lalu cara membuatnya bagaimana..? Langsung saja sob tanpa panjang lebar kita masuk ke pokok pembahasanya. Silahkan anda ikuti langkah-langkahnya berikut ini.

Tutorial Membuat Artikel Terbaru Keren Di Blog

1. Login ke blog sobat terlebih dahulu
2. Kemudian silahkan sobat masuk ke Tata Letak
3. Setelah itu Tambahkan Gadget dan pilih HTML/javascript
3. Letakan kode script dibawah ini pada widget HTML/javascript yang telah anda tambahkan tadi sob

 <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>
<marquee behavior="scroll" direction="up" scrollamount="2" onmouseover="this.stop()" onmouseout="this.start()">
<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>
<script>
var numposts = 15;
var showpostdate = false;
var showpostsummary = false;
var numchars = 100;
</script>
<script src="http://ilmu-wongcilik.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=rp"></script></marquee>

Keterangan.

• Ganti tulisan yang berwarna merah dengan alamat blog anda
• Tulisan yang berwarna biru adalah jumlah artikel yang akan ditampilkan, silahkan ganti sesuai keinginan anda

4. Kemudian Simpan dan silahkan lihat hasilnya

Begitulah sob tutorial membuat widget artikel terbaru dengan efek tulisan berjalan ke atas, mudah-mudahan artikel ini dapat membantu anda untuk memperindah tampilan blog sobat, Silahkan di coba pada blog sobat masing-masing. Selamat mencoba dan semoga bermanfaat..