Sabtu, 31 Agustus 2013

Membuat Recent Post Effek Slideshow di Blogspot

Recent post merupakan bentuk dari pembaruan dari artikel yang baru diposting atau baru diupdate. Bagaimana Membuat Recent Post Effek Slideshow di Blogspot ? Tentunya ini sangat menarik berguna untuk pengunjung untuk mengetahui sejauh mana kita telah mengupdate artikel kita dalam bentuk recent post atau istilah postingan baru dikirim atau postingan terkini dari yang baru kita buat.
Widget recent post menjadi salah satu kelebihan bagi blog yang sering update konten atau blogspotnya karena pengunjung lebih menyukai blog yang sering update dari blog yang gerak jalan ditempat atau blog jarang update postingan.
Tampilan postingan terbaru bisa sobat buat sesuai jumlah dan kapasitas blogspot sobat sendiri,apakah mau menampilkan postingan terbaru jumlah 10 post dari keterangan di widget recent post, dengan kata lain sobat dapat menampilkan jumlah post terbaru sesuai dengan keinginan sobat.
Okelah kalau begitu saya berikan script kodenya kepada sobat blogger disini. Caranya tinggal copas kodenya ke sidebar atau widget sobat dengan Tambahkan Gadget dan Pilih HTML/JavaScript. Berikut kodenya :

<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:310px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:285px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:75px;
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:11px;
color:#b40606;
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;
}
.spysummary{
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] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_TkVTE5ldqeBr9bYHAYKYZqt1rV0-BSRNfUrFkVbYrCvNa_Q-G7OaG2CM3j0Fj1Wg19KIJbAs2YjNC0cukZWiuijQOT2vmuOqPdZEIRmbMK8B2Z_AfP0dz02MMPP5sL9ByWXAcexdL75Y/s1600/favicon.png";
imgr[1] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_TkVTE5ldqeBr9bYHAYKYZqt1rV0-BSRNfUrFkVbYrCvNa_Q-G7OaG2CM3j0Fj1Wg19KIJbAs2YjNC0cukZWiuijQOT2vmuOqPdZEIRmbMK8B2Z_AfP0dz02MMPP5sL9ByWXAcexdL75Y/s1600/favicon.png";
imgr[2] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_TkVTE5ldqeBr9bYHAYKYZqt1rV0-BSRNfUrFkVbYrCvNa_Q-G7OaG2CM3j0Fj1Wg19KIJbAs2YjNC0cukZWiuijQOT2vmuOqPdZEIRmbMK8B2Z_AfP0dz02MMPP5sL9ByWXAcexdL75Y/s1600/favicon.png";
imgr[3] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_TkVTE5ldqeBr9bYHAYKYZqt1rV0-BSRNfUrFkVbYrCvNa_Q-G7OaG2CM3j0Fj1Wg19KIJbAs2YjNC0cukZWiuijQOT2vmuOqPdZEIRmbMK8B2Z_AfP0dz02MMPP5sL9ByWXAcexdL75Y/s1600/favicon.png";
imgr[4] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_TkVTE5ldqeBr9bYHAYKYZqt1rV0-BSRNfUrFkVbYrCvNa_Q-G7OaG2CM3j0Fj1Wg19KIJbAs2YjNC0cukZWiuijQOT2vmuOqPdZEIRmbMK8B2Z_AfP0dz02MMPP5sL9ByWXAcexdL75Y/s1600/favicon.png";
showRandomImg = true;
boxwidth = 255;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 100;
thumbheight = 70;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = true;
showSummaryPost = true;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 8;
home_page = "http://www.4kom.blogspot.com/";
limitspy=4
intervalspy=4000
</script>
<div id="spylist">
<script src='http://file.edikomputer.com/js/recentpostslide.js' type='text/javascript'></script>


Hasilnya :

recent post

Keterangannya :
  •  Ganti URI Image Yang di beri warna kuning dengan image dari artikel yang anda posting.
  •  Ganti URL yang berwarna merah tersebut dengan alamat web atau blog sobat dan kemudian sesuaikan dan atur berapa jumlah post yang ingin ditampilkan pada kode numposts = 8; 

Demikian postingan saya kali ini tentang bagaimana Membuat Recent Post Effek Slideshow di Blogspot. Semoga artikel ini dapat berguna dan memberikan manfaat besar bagi para pembaca khususnya sobat blogger

Source
Salam Senyum Sukses <3S>
Komentar Facebook
0 Komentar Blogger

Tidak ada komentar:

Posting Komentar

Related Posts Plugin for WordPress, Blogger...