Home » » Cara Membuat Recent Post Slide Show

Cara Membuat Recent Post Slide Show

Kali ini saya akan membahas tentang cara membuat recent post yang berefek slide show. Menurut kalian apa gunanya recent post slide show??? kalau menurut saya sih agar blog kita akan terlihat cantik dan menarik, dan agar pengunjung blog merasa betah di blog kita. Untuk membuatnya cukup mudah, kita hanya memasukkan kode script ke dalam gadget. Nah...langsung saja cara membuatnya di bawah ini :

1. Login blogger
2. Pilih rancangan >> klik tambah gadget >> klik Html/JavaScript.
3. Masukan kode di bawah ini :


<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] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisAtRIG-98RRfoXbWV5Jl4D6Xa7SfnSzCRcVXIKlWGcO-LvcQlJ6K2v1PT2IfvEZbBBlPU0CcJVndndG1dPjoOnnY6fhZVY9GGI_BaTSCiNPhq8aFeP2Ta7ZiQvXoSEFgNjEojX3hlgxc/s288/m-azkadoffolow.gif";

imgr[1] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisAtRIG-98RRfoXbWV5Jl4D6Xa7SfnSzCRcVXIKlWGcO-LvcQlJ6K2v1PT2IfvEZbBBlPU0CcJVndndG1dPjoOnnY6fhZVY9GGI_BaTSCiNPhq8aFeP2Ta7ZiQvXoSEFgNjEojX3hlgxc/s288/m-azkadoffolow.gif";

imgr[2] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisAtRIG-98RRfoXbWV5Jl4D6Xa7SfnSzCRcVXIKlWGcO-LvcQlJ6K2v1PT2IfvEZbBBlPU0CcJVndndG1dPjoOnnY6fhZVY9GGI_BaTSCiNPhq8aFeP2Ta7ZiQvXoSEFgNjEojX3hlgxc/s288/m-azkadoffolow.gif";

imgr[3] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisAtRIG-98RRfoXbWV5Jl4D6Xa7SfnSzCRcVXIKlWGcO-LvcQlJ6K2v1PT2IfvEZbBBlPU0CcJVndndG1dPjoOnnY6fhZVY9GGI_BaTSCiNPhq8aFeP2Ta7ZiQvXoSEFgNjEojX3hlgxc/s288/m-azkadoffolow.gif";

imgr[4] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisAtRIG-98RRfoXbWV5Jl4D6Xa7SfnSzCRcVXIKlWGcO-LvcQlJ6K2v1PT2IfvEZbBBlPU0CcJVndndG1dPjoOnnY6fhZVY9GGI_BaTSCiNPhq8aFeP2Ta7ZiQvXoSEFgNjEojX3hlgxc/s288/m-azkadoffolow.gif";
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://nama.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>

4. Simpan dan lihat hasilnya.

Keterangan : http://nama.blogspot.com/ >> ganti dengan alamat blog sobat.

Good Luck  ^_^
Share this article :

0 comments:

Posting Komentar

Jangan lupa komennya ya demi membangun blog ini agar menjadi lebih baik dari sekarang saran anda sangat berarti untuk perkembangan blog ini :)

 
Copyright © 2011. Indonesian Toshokan - All Rights Reserved