Malam Sobat Free Download dan Tutorial, hadir kembali malam ini untuk share tentang tutorial yang pernah saya ketahui. seperti semboyan saya untuk blog ini, "Share Anything What I know", berbagi apa saja yang kuketahui...:) Setelah sebelumnya saya share mengenai Cara Membuat Kotak Berlangganan/Subscribe di blog, kali ini saya akan share tentang Cara Membuat Recent Post Dengan Gambar Bergerak di Blog. Recent Post merupakan berita, atau postingan-postingan terbaru dari blog anda. Nah, disini saya akan share cara membuat atau menampilkan recent post yang keren. yaitu dengan tampilan gambar, serta bergerak. Tampilannya, bisa anda lihat pada gambar di postingan ini. Baiklah, langsung saja ke prakteknya. silahkan sobat ikuti langkah-langkah berikut ini.
- Login ke akun Blogger Anda
- Klik Tata Letak > Tambah Gadget lalu pilih HTML/JavaScript
- Copy dan Pastekan Script dibawah ini
<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:320px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:300px;
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 = 300;
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://rudihartoyo.blogspot.com/";
limitspy=4
intervalspy=4000
</script>
<div id="spylist">
<script src="http://infonetmu.googlecode.com/files/recentpostthumbslideshow.js" type="text/javascript">
</script></div> - Keterangan :
- Angka yang berwarna Hijau merupakan lebar dari Widget ini, bisa di sesuaikan sesuai sidebar anda
- Angka yang berwarna Biru, merupakan jumlah Post yang ingin ditampilkan.
- Url yang berwarna merah ganti dengan url Blog anda.
- Setelah selesai, silahkan simpan dan lihat hasilnya.
Sumber : http://www.amronbadriza.com/2012/10/cara-membuat-recent-post-berjalan-di.html
This is dummy text. It is not meant to be read. Accordingly, it is difficult to figure out when to end it. But then, this is dummy text. It is not meant to be read. Period.
# Silahkan Anda Berkomentar dengan Baik dan Sopan
# Pesan dilarang Mengandung SARA dan Spam
# Terima Kasih Telah berkunjung di Blog Sederhana ini ConversionConversion EmoticonEmoticon