Minggu, 13 Januari 2013

Cara Membuat Recent Post Berjalan di Blog



Cara/trik mengatur/mensetting recent post bisa berjalan/bergerak atau cara menjadikan artikel-artikel terbaru berjalan atau cara agar recent post bisa berjalan pada/di blog.

Beberapa waktu yang lalu, saya pernah posting artikel mengenai cara membuat/memberi recent post di blog, dimana artikel tersebut memang trik membuat recent post di blog, tapi recent post biasa. Nah, pada kesempatan ini saya akan berbagi artikel yang masih terkait dengan postingan tersebut yaitu trik mensetting recent post bisa berjalan diblog. Banyak cara untuk menampilkan recent post pada blog kita, sehingga blog kita bisa tampil lebih cantik. Selain dapat mempermudah pengunjung untuk lebih banyak membaca artikel kita yang lainya, sama halnya dengan artikel terkait atau related post, recent post juga bisa dengan tampilan thumbnail, nah kali ini saya akan memberi tutorial tentang cara membuat recent post berjalan yang pastinya sangat mudah untuk dilakukan.
Lalu bagaimana cara agar recent post dapat berjalan di blog? Ikuti tutorial dibawah ini:
  1. Masuk ke dashbor blog sobat.
  2. Klik Tata Letak >> Tambah Gadget >> Pilih HTML/Java Script.
  3. Masukan kode berikut ke dalam box HTML/Java Script tadi
<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;
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://sayatausekarang.blogspot.com/";
limitspy=4
intervalspy=4000
</script>
<div id="spylist">
<script src="http://infonetmu.googlecode.com/files/recentpostthumbslideshow.js" type="text/javascript">
</script></div>
  1. Simpan.
Note :
  • Url yang berwarna merah ganti dengan Url sobat
  • Angka yang berwarna biru jumlah post yang ingin di tampilkan
Demikianlah postingan mengenai cara membuat recent post berjalandi blog. Semoga bermanfaat buat semua. 
Referensi: http://infonetmu.blogspot.com/2012/01/cara-membuat-recent-post-berjalan.html

Tidak ada komentar:

Posting Komentar