Cara Membuat Slide Recent Post Di Blog

Alif Ilmu - Untuk membuat sedikit variasi pada blog kita, mungkin ada baiknya kita mencoba beberapa trik untuk mempercantik blog kita itu, misalnya dengan cara membuat slide recent post di blog kita. Slide recent post ini merupakan kumpulan posting terbaru yang kita terbitkan namun pada saat tampil akan membentuk suatu slide, untuk contohnya silahkan lihat pada pojok kanan atas blog ini.

Lalu bagaimana cara membuatnya? mungkin bagi sebagian blogger, terutama blogger seniot hal ini sangatlah mudah, tapi mungkin bagi sebagian lagi ini adalah hal baru yang cukup baik untuk dijadikan perbendaharaan kita sebagai blogger.

Untuk membuatnya silahkan ikuti langkah berikut ini:

1. Masuk dulu ke menu dasbor blog anda, kemudian klik pada pilihan rancangan
2. Setelah itu pilih Elemen Halaman
3. Kemudian klik tambah gadget
4. Klik pada pilihan html/java script
5. Silahkan copy paste script di bawah ini :

<script language='javascript'>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style type="text/css" media="screen">
<!--

#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:220px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:208px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg) repeat-x;
border:1px solid #ddd;
}

#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:5px;
background:#EFEFEF;
border:0;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}

.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}

-->
</style>

<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 = 600;

cellspacing = 6;

borderColor = "#232c35";

bgTD = "#000000";

thumbwidth = 80;

thumbheight = 70;

fntsize = 12;

acolor = "#666";

aBold = true;

icon = " ";

text = "comments";

showPostDate = true;

summaryPost = 40;

summaryFontsize = 10;

summaryColor = "#666";

icon2 = " ";

numposts = 10;

home_page = "http://www.teras-info.blogspot.com/";

limitspy=4
intervalspy=4000

</script>

<div id="spylist">
<script src='http://scriptabufarhan.googlecode.com/svn/trunk/recentpostthumbspy-min.js' type='text/javascript'></script>
</div>

Pada bagian yang saya beri warna merah tebal, silahkan ubah alamat blognya dengan alamat blog anda, kemudian pada bagian yang saya beri warna biru tebal silahkan ubah nilai 10 menjadi sesuka anda, misalnya lima dan sebagainya.

Keterangan:

-home_page = "http://www.teras-info.blogspot.com/"; merupakan tempat dimana tempat alamat postingan blog anda. Jadi jangan lupa untuk mengganti alamatnya dengan blog anda.

-numposts = 10; merupakan jumlah postingan atau artikel yang akan di tampilkan pada slide yang anda buat.


Setelah anda selesai melakukan langkah-langkah di atas, silahkan klik simpan dan kemuadian silahkan anda lihat hasilnya.....Selamat mencoba......