cara membuat recent post slide show

cara membuat recent post slide show

Recent post atau sering di sebut dengan artikel terbaru. Recent Post sangat penting bagi blog kita dengan Recent Post maka pengunjung dapat mengetahui artikel-artikel terbaru di blog kita.

Recent Post bisa di tampilkan dengan banyak ragam, salah satunya dengan Recent Post Slide Show. Recent Post Slide Show ini menggunakan tampilan thumbnail atau gambar sehingga pengunjung blog kita bisa tertarik denga artikel terbaru di blog kita.

saya perlihatkan contoh gambar Recent Post Slide Show.



1. pertama-tama login terlebih dahulu ke blog anda.
2. kemudian klik "tata letak".
3. klik tambah "gadget"
4. kemudian pilih tambah Html/JavaScript
5. setelah itu copykan kode/script di bawah ini dan simpan. lihat hasilnya.

<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:245px;
}
#spylist ul{
width:300px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:280px;
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 = 10;
home_page = "http://sahabatbloggerr.blogspot.com/";
limitspy=4
intervalspy=4000
</script>
<div id="spylist">
<script src="http://infonetmu.googlecode.com/files/recentpostthumbslideshow.js" type="text/javascript">
</script></div>

pemberitahuan :

• Ganti kode/script yang berwarna merah sesuai dengan keinginan andakode itu merupakan tinggi dan lebar kolom.
• ganti tulisan yang berwarna biru dengan URL blog anda
• untuk tulisan yang berwarna hijau adalah jumlah artikel yang muncul dalam
• slide show. anda bisa menggantinya dengan keinginan anda.