0

image

Salah satu cara agar postingan yang baru kita terbitkan dapat diketahui oleh pengunjung adalah dengan membuat widget recent Post. Selain untuk mempermudah pengunjung mengetahui posting terkini yang kita terbitkan, widget ini juga dapat menambah daya tarik blog. Apalagi widget yang satu ini disertai dengan animasi dan thumbnail pastinya sangat memukau para pengunjung ... heheeee...

Sebenarnya ada banyak cara yang ditawarkan di internet, ada yang dengan mengubah html ada juga yang hanya menambahkannya sebagai widget. Di beberapa artikel disebutkan bahwa menambah widget lebih baik jika harus mengubah kode html, selain lebih aman juga tidak membuat log kita Lola (loading lama) ....

Oke langsung ke TKP, bagi agan yang tertarik memasang widget recent Post di blognya bisa ikuti tips berikut!

1.     Masuk ke dasbor ----à tata letak

2.     Klik tambah widget di tempat yang disukai

3.     Pilih tambah html/JAVA script.

4.     Masukan script berikut

 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript">

</script>

<style media="screen" type="text/css">

<!--

#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 = 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 = 20;

home_page = "http://hudamaulana.blogspot.com/";

limitspy=4

intervalspy=4000

</script>

<div id="spylist">

<script src="http://infonetmu.googlecode.com/files/recentpostthumbslideshow.js" type="text/javascript">

</script></div>

 

Keterangan :

Ø Ganti angka pada numposts dengan jumlah postingan terbaru yang ingin ditampilkan

Ganti alamat Url (yang berwarna merah) dengan alamat Url agan

Post a Comment Blogger

 
Top