Membuat Recent Posts Keren di Blog

Membuat Recent Posts Keren di Blog

Membuat Recent Posts Keren di Blog. . . 

Sebenarnya blogger telah menyediakan widget recent posts, tapi menurut saya widget tersebut kurang elegant bahkan mungkin terkesan standar untuk di pasang di blog kita.

Bagi sobat blogger yang ingin memasang widget recent posts dengan tampilan elegant seperti yang ada pada gambar disamping atau seperti yang ada di side bar blog saya, tidak ada salahnya sobat blogger ngikutin tips blogging yang satu ini.

Tips Blogging kali adalah cara membuat widget recent posts keren di blog, klaw sobat blogger sudah tidak sabar pengen tahu caranya, silahkan simak baik - baik langkah - langkahnya dibawah ini :

Yang Pertama, seperi biasa, login dulu ke akun Blogger sobat blogger.

Yang Kedua, setelah berada di Dasbor sobat blogger, pilih Tata Letak.

Yang Ketiga, klik Tambah Gadget, kemudian akan muncul jendela baru untuk memilih gadget.

Yang Keempat, kemudian cari dan klik Gadget/HTML Javascript pada jendela baru tersebut.

Yang kelima, setelah jendela Mengkonfigurasi HTML/Javascript muncul, Copy kode dibawah ini dan paste kan didalamnya.

<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://dl.getdropbox.com/u/708209/scriptabufarhan/recentspy/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 = 255;

cellspacing = 6;

borderColor = "#232c35";

bgTD = "#000000";

thumbwidth = 70;

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://infobuatkalian.blogspot.com/";

limitspy=4
intervalspy=4000


</script>

<div id="spylist">
    <script src='http://dl.getdropbox.com/u/708209/scriptabufarhan/recentspy/recentpostthumbspy-min.js' type='text/javascript'></script>
</div>

Ganti kode yang berwarna merah dengan alamat blog sobat blogger.
Yang terakhir, klik Simpan.