Assalamu'alaikum...!
Widget Recent Post Animasi Dengan JQuery
1. Setelah sig in pada blogger dengan account anda>>>pada dasbor klik rancangan >>>
pada elemen laman >>>klik tambah gadget >>>HTML/JavaScript >>>
2. Copy kode berikut dan paste pada kolom konten
Seperti itulah kodenya hemmm,,,,PERLU DI KETAHUI JANGAN LUPA ALAMAT home page di ganti dengan alamat blog sobat (tulisan warna merah silahkan diganti alamat blog sobat).
oya...dan jangan lupa disimpan iyahhhh hehehe,,,,
oke deh.......!!!!
Salam blogger, pakabar sahabat blogger semua, dipagi hari yang cerah dan suasana yang dingin dikarenakan di desaku dimana saya tinggal habis diguyur hujan loh...!!!tidak
begitu aja tadi sewaktu anterin adek sekolah di jalan kehujanan yahh
mau gimna lagi tak bawa jas hujan akhirnya hujan-hujanan deh!!!!!
Seiring
dengan kemajuan java sript widget recent post menampilkan gaya baru ala
masakini loh,,,,xixixi kayak masakan aja ala masakini, yahhh begitulah kenyataannya, sebuah recent post yang bisa berganti-ganti dengan animasinya yang keren, saya yakin pasti temen blogger semua sudah banyak yang tau
Namun apasalahnya
saya berbagi sapa tau temen blogger blm ada yang tau dan bisa
mencoba,,,nah bisa menambah pengetahuan kannn....berbagi itu kan gak
rugi ya gak kata Bapak TB kalau ilmu yang tax di amalkan bagaikan pohon yang tak berbuah, betul kan....ehemmm....baiklah kalau begitu langsung aja ke TKP di mana saya meletakkan java scriptnya :
1. Setelah sig in pada blogger dengan account anda>>>pada dasbor klik rancangan >>>
pada elemen laman >>>klik tambah gadget >>>HTML/JavaScript >>>
2. Copy kode berikut dan paste pada kolom konten
<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://dl.getdropbox.com/u/708209/scriptabufarhan/recentspy/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://qinginbisa.blogspot.com/";
limitspy=4
intervalspy=4000
</script>
<div id="spylist">
<script src='http://dl.getdropbox.com/u/708209/scriptabufarhan/recentspy/recentpostthumbspy-min.js' type='text/javascript'></script>
</div>
Seperti itulah kodenya hemmm,,,,PERLU DI KETAHUI JANGAN LUPA ALAMAT home page di ganti dengan alamat blog sobat (tulisan warna merah silahkan diganti alamat blog sobat).
oya...dan jangan lupa disimpan iyahhhh hehehe,,,,
oke deh.......!!!!
SELAMAT MENCOBA SEMOGA ANDA BERHASIL DAN SUKSES SLL
Tags:
Trick and tips blogger
Leave a comment