Blog Seputar Tutorial Komputer, Printer, Windows, Android, Blackberry, Dan Informasi Teknologi

Membuat Artikel Terbaru Keren Dengan Efek Berjalan Di Blog

Cara Membuat Artikel Terbaru Keren Di Blog - Menampilkan widget Artikel Terbaru di blog merupakan hal yang sangat penting sekali, tujuanya yaitu untuk mempermudah pengunjung mengetahui apa saja artikel yang terbaru pada blog anda. Selain itu artikel terbaru juga berpengaruh untuk menambah pagview pada blog sobat, sebab dengan menambahkan widget artikel terbaru secara tidak langsung akan membuat pengunjung melihat artikel yang baru saja anda posting dan bisa saja artikel tersebut yang sedang dicari oleh pengunjung blog anda. Mungkin sobat sering melihat ketika berkunjung di sebuah blog tentang tampilan artikel terbaru yang berbeda-beda. ( Baca Juga Cara Membuat Popular Post Berwarna Di Blog )

 Membuat Artikel Terbaru Dengan Efek Tulisan Berjalan

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.

Membuat Artikel Terbaru Keren Dengan Efek Berjalan Di Blog


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..

Previous
Next Post »

PERINGATAN..!!
1. Berkomentarlah Sesuai Judul Diatas Dengan Sopan dan Jangan Spaming.!!
2. Dilarang Berkomentar Yang Mengandung Unsur Pornografi dan Sara.!!
3. Mohon Maaf Bagi Yang Berkomentar Melampirkan Link Langsung Ane Masukan Spam.!!

Matur Nuwon Sanget Atas Perhatiane Panjenengan Sedoyo. Salam Blogger Wongcilik.

 

Contact Form

Name

Email *

Message *