Saturday, October 22, 2011

Cara Membuat Recent Post Slide (Thumbnile)

Recent post atau newest post biasanya hanya berbentuk tulisan ataupun gambar di sidebar anda. Tapi sekarang sudah ada recen post yang berbentuk slide sehingga lebih terkesan indah dan menarik bagi pengunjung anda

Berikut Langkah-Langkahnya :

  1. Login ke Blogger
  2. Klik Rancangan ==> Tambah Gadget.
  3. Pilih yang HTML/JavaScript.
  4. Copy kode dibawah ini ke dalam kolom kosong yang tersedia :
<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 = 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 = 7;

home_page = "http://dytofree.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>

    5. Save Template

Note :
1. Ganti Tulisan Yang berwarna Merah dengan alamat blog anda
2. Tulisan yang berwarna Kuning adalah jumlah recen post yang akan di tampilkan


Thanks for reading: Cara Membuat Recent Post Slide (Thumbnile)

Baca Juga: Cara Mendapatkan Gadget Gratis dari Gokano



Jika anda menyukai artikel Cara Membuat Recent Post Slide (Thumbnile), silahkan di link balik dengan menyertakan link berikut di situs anda . Terima kasih.


Baca Juga:

1 comments:

kok di blog saya nggak bisa slide . cuma gambar diam di sidebarnya ?

Post a Comment

Share

Twitter Delicious Facebook Digg Stumbleupon Favorites