|
|
Recent posts with thumbnail and simple spy adalah recent post hasil dari pengembangan Mas Abu Farhan seorang blogger indonesia juga. saya hanya mengubah dengan memberikan sedikit tampilan yang menarik.
Baiklah Disini saya akan memberikan contoh tampilan Recent Post With Thumbnail And Simple Spy. berikut contohnya :
Berikut Scriptnya :
<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;padding:5px 5px;
margin:0px 0px 5px 0px;
margin-top:5px;
height:350px;width:220px;
background:#48b5f2 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimPYiKxdjxYYMUYq_xRAy_LEI9mvgJEAGyo-cks273c1cb3I_oF0VaIP7V6YDfOK01pX7vqv5zG4xD2XeM0lVMuBXqRQD5Zq5fJdP4C9xYlXbmyJ3pkgY5q-y07cGZN9AmJe2s6SxYspU/s1600/button_bg.png);
border-bottom:5px double #111;border-left:5px double #48b5f2;border-top:5px double #111;border-right:5px double #48b5f2;
}
#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:#1D1D1D;opacity:0.8;
border:1px dotted #84acc3;border-radius:5px;
}
#spylist li a {
text-decoration:none;
color:#ccc;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;box-shadow:1px 1px 10px #48b5f2;-moz-box-shadow:1px 1px 10px #48b5f2;-webkit-box-shadow:1px 1px 10px #48b5f2;
margin-right:5px;
border:1px solid #fff;border-radius:5px;
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] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaz5Gx9vcgSJ1q-cuPiH3ozE3kE6-Se324_NgJc3Wmxc9-kPNOzfew7X6sd7ppGJ7ncVdgUlRzjszMGNdFYV6mapJMUjTMn0J-tp8_2BvNdbFAIabGFNMrQgMJTBeSUmEuLZXODDAbEJU/s1600/coretv+no_image.jpg";
imgr[1] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaz5Gx9vcgSJ1q-cuPiH3ozE3kE6-Se324_NgJc3Wmxc9-kPNOzfew7X6sd7ppGJ7ncVdgUlRzjszMGNdFYV6mapJMUjTMn0J-tp8_2BvNdbFAIabGFNMrQgMJTBeSUmEuLZXODDAbEJU/s1600/coretv+no_image.jpg";
imgr[2] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaz5Gx9vcgSJ1q-cuPiH3ozE3kE6-Se324_NgJc3Wmxc9-kPNOzfew7X6sd7ppGJ7ncVdgUlRzjszMGNdFYV6mapJMUjTMn0J-tp8_2BvNdbFAIabGFNMrQgMJTBeSUmEuLZXODDAbEJU/s1600/coretv+no_image.jpg";
imgr[3] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaz5Gx9vcgSJ1q-cuPiH3ozE3kE6-Se324_NgJc3Wmxc9-kPNOzfew7X6sd7ppGJ7ncVdgUlRzjszMGNdFYV6mapJMUjTMn0J-tp8_2BvNdbFAIabGFNMrQgMJTBeSUmEuLZXODDAbEJU/s1600/coretv+no_image.jpg";
imgr[4] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaz5Gx9vcgSJ1q-cuPiH3ozE3kE6-Se324_NgJc3Wmxc9-kPNOzfew7X6sd7ppGJ7ncVdgUlRzjszMGNdFYV6mapJMUjTMn0J-tp8_2BvNdbFAIabGFNMrQgMJTBeSUmEuLZXODDAbEJU/s1600/coretv+no_image.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://ut2a-4down.blogspot.com/";
limitspy=4
intervalspy=4000
</script>
<div id="spylist">
<script src='http://kangdadang.googlecode.com/files/recentpostthumbspy-by-abufarhan.js' type='text/javascript'></script>
</div>
KET :
- Ganti teks yang berwarna Merah dengan URL Blog sobat.
- Perhatikan script diatas yang berwarna biru muda, jika sobat sudah memasang, maka tidak perlu lagi memakai script diatas (biar gak double).
Tertarik ingin memasangnya? berikut langkah singkat dan padatnya, tidak perlu backup template karena kita akan meletakkannya langsung di elemen halaman.
Seperti biasa sobat langsung masuk aja ::>>
1. To the point aja .. klik Rancangan
2. Kemudian klik Tamhah Gadget
4. Masukkan salah satu kode diatas kedalamnya :
5. Simpan. dan Lihat hasilnya.
Semoga bermanfaat.
Silahkan anda laporkan jika ada link yang rusak atau beberapa tutorial yang tidak bekerja, karena saya akan segera memperbaikinya, dan berhubung saya baru mengganti themes blog, jadi pasti banyak artikel yang berantakan!
Saya harap anda dapat membantu saya untuk memperbaiki semuanya dengan berkomentar di artikel yang bermasalah..
thanks sebelumnya sudah berkunjung keblog utta yang sederhana ini...
Please rate this article:
{[['
', '
']]}
', '']]}{["Useless", "Boring", "Need more details", "Perfect"]}
Jika Artikel ini menarik, Silahkan copy paste permalink berikut ini di blog sobat!
:t mantap gan
BalasHapus