Cara Membuat Recent Post Dengan Tambahan Thumbnails [1] - via kode Script

Recent Post merupakan salah satu aksesoris di dalam blog, kenapa bisa demikian? Selain membuat tampilan blog tampak cantik Recent Post juga akan mempermudah pengunjung untuk melihat artikel baru lainnya yang telah kita buat sebelumnya.

Dikesempatan sebelumnya, saya juga telah pernah membuat Recent Post menggunakan Feed, bisa lihat di sini caranya. Nah, untuk tutorial kali ini saya ingin share Cara Membuat Recent Post Dengan Tambahan Thumbnails, unik bukan teman-teman, hehehe.

Lihat pict

Recent Post dengan tambahan thumbnails selain blog kita akan terlihat profesional, orang yang berkunjung akan tertarik untuk melihat artikel lainnya.

Note 1: Jika teman-teman ingin Membuat Recent Post Dengan Tambahan Thumbnails, maka hal itu akan membuat lambat loading blog atau web kita, karena script ini menggunakan Javascript.

Saya juga sebelumnya menggunakan ini, tapi memang membuat blog loadingnya menjadi lambat, sehingga saya hapus scriptnya. Tapi jika teman-teman semua ingin mencobanya, ya tidak ada salahnya, malah semakin bagus, lebih baik coba-coba daripada tidak pernah sama sekali, betul?

Ok, ikuti langkah-langkah di bawah ini:

1. Masuk ke Design >> Page Element >> Add a Gadget >> HTML-Javascript,
2. Buat judul baru di bagian titel, misal: New Recent Post
3. Teman-teman copy paste kode di bawah ini:

<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";

showRandomImg = true;
boxwidth = 298;
cellspacing = 8;
borderColor = "#ffffff";
bgTD = "#000000";

thumbwidth = 40;
thumbheight = 40;

fntsize = 10;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = true;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";

icon2 = " ";
numposts = 5;
home_page = "http://cantik-2013.blogspot.com/";
</script>
<script src="http://myblogtalk.com/bloggertemplates/js/recentposts_thumbnail.js" type="text/javascript"></script>

Note 2:

Teman-teman bisa merubah scriptnya sesuai keterangan di bawah ini:

- boxwidth: Lebar widget cellspacing: Space antara cells (default adalah 1 sudah bagus)
- borderColor: Warna Border (Warna template widget bisa teman-teman ganti, defaultnya putih)
- thumbwidth & thumbheight - Lebar dan panjang thumbnail (default 40)
- fntsize: Ukuran huruf judul postingan
- acolor: Warna huruf judul postingan
- aBold: Bila ingin ditebalkan adalah true, jika tidak false saja.
- numposts: Berapa banyak recent post yang akan ditampilkan
- homepage: http://cantik-2013.blogspot.com/(Silahkan ganti dengan Url blog teman-teman)

Sebelumnya pastikan dulu Seeting Site Feed blog teman-teman sudah Allow Blog Feed dengan melihat pada Setting >> Site Feed >> Full >> Allow Blog Feeds.

Selamat mencoba Membuat Recent Post Dengan Tambahan Thumbnails [1] - via kode Script!