Cara Membuat Recent Post Bergerak Dengan Thumbnail

Diposting oleh Unknown on Selasa, 29 Mei 2012


Cara Membuat Recent Post Bergerak disertai Thumbnail - membuat recent post memang sudah biasa dilakukan oleh blogger, dan membuatnya cukup mudah yaitu dengan menambahkan gadget di blog dan langsung jadi Recent post sederhana, tetapi bagaimana dengan Recent Post Bergerak disertai Thumbnail apakah anda sudah membuatnya di blog anda?

Preview:
Cara Membuat Recent Post Bergerak disertai Thumbnail
Cara Membuat Recent Post Bergerak disertai Thumbnail

Itu dia, jika anda ingin menambah di blog anda gunakan cara yang saya berikan ini, saya yakin mudah kok, anda cukup copy code dibawah ini di Add Gadget di sidebar blog anda..

Ini dia code HTML Recent Post Bergerak disertai Thumbnail:


<center><h2><b>..::Recent Post::..</b></h2></center>
<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;
 
margin-bottom:-20px;
 
padding:0px 0px -20px 0px;
 
height:350px;
 
}
 
#spylist ul{
 
width:280px;
 
overflow:hidden;
 
float:center;
 
list-style-type: none;
 
padding: 0px 0px;
 
margin:0px 0px;
 
}
 
#spylist li {
 
width:262px;
 
padding: 2px 2px;
 
margin:0px 0px 5px 0px;
 
list-style-type:none;
 
float:none;
 
height:70px;
 
overflow: hidden;
 
background:transparent;
 
border:0px solid #ddd;
 
}
 

#spylist li a {
 
text-decoration:none;
 
color:#A32929;
 
font-size:12px;
 
height:0px;
 
overflow:hidden;

margin: 0px 0px;
 
padding:0px 0px 0px 0px;
 
}
 
#spylist li img {
 
float:left;
 
margin-right:5px;
 
background:#EFEFEF;
 
border:0;
 
}
 
.spydate{
 
overflow:hidden;
 
font-size:0px;
 
color:#0284C2;
 
padding:2px 0px;
 
margin:1px 0px 0px 0px;
 
height:0px;
 
font-family:Tahoma,Arial,verdana, sans-serif;

}
 
.spycomment{
 
overflow:hidden;
 
font-family:Tahoma,Arial,verdana, sans-serif;
 
font-size:0px;
 
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 = " ";
 
showPostDate = false;
 
showcomments = false;
 
summaryPost = 40;
 
summaryFontsize = 10;
 
summaryColor = "#666";
 
icon2 = " ";
 
numposts = 20;
 
home_page = "
 http://zidiyuto.blogspot.com/ ";
limitspy=4
 
intervalspy=4000
 
</script>
 
<div id="spylist">
 
<script src="http://sites.google.com/site/testingsahaja/recentpostslide.js?attredirects=0&d=1" type="text/javascript"></script>
 
</div>
 



Pastekan code ini di kotak HTML tersebut, dan jangan lupa anda ubah kata yang warna merah di atas menjadi alamat blog anda, jika sudah maka klik save,  dan anda pun sekarang sudah selesai memasang widget Recent Post Bergerak disertai Thumbnail di blog anda, selamat mencoba...
Jika tidak berkerja berarti template blog anda tidak support dengan tutorial ini..

{ 1 komentar... read them below or add one }

Koky mengatakan...

nambahin gambarnya gimana caranya ? saya kok kosong thumbailnya kok min ?

Posting Komentar

Terima Kasih Sudah Berkunjung ,, Jangan Lupa Berikan Komentarnya Untuk Artikel Ini