Cara Membuat Recent Post Berjalan - Kali ini saya akan membahas Tutorial Blog dan Tips Blog yaitu Cara Membuat Recent Post Berjalan sebelumnya
saya pernah bahas tentang cara membuat recent post dengan Thumbnail
atau gambar, nah sekarang beri sedikit efek, yaitu efek berjalan dari
atas ke bawah, jadi berjalan gitu recent post nya, owh iya bagi yang
tidak tahu apa itu recent post saya akan jelaskan Recent Post adalah
Artikel Terbaru jika kita memasang widget Recent Post maka artikel
terbaru kita akan ditampilkan di sidebar blog, jadi fungsinya memudahkan
pengunjung melihat artikel terbaru Blog kamu, sehingga akan menambah
minat membaca pengunjung. Ok langsung saja cara membuat Recent Post Berjalan.- Login ke Blog kamu.
- Pilih Add Gadget HTML Java Script.
- Copy kode di bawah ini.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript">Keterangan :
</script>
<style media="screen" type="text/css">
<!--
#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 = 20;
home_page = "http://blazerracing.blogspot.com/";
limitspy=4
intervalspy=4000
</script>
<div id="spylist">
<script src="http://infonetmu.googlecode.com/files/recentpostthumbslideshow.js" type="text/javascript">
</script></div>
Ganti URL yang berwarna merah dengan Alamat Blog kamu.
numposts adalah jumlah recent post yang akan ditapilkan.
Sekian penjelasan dari saya, jika ada hal yang kurang paham silahkan tinggalkan pesan di kotak komentar.