Memasang Widget Recent Post Thumbnail Gambar Mini

Postingan kali ini akan membahas tutorial tentang membuat widget recent post dengan thumbnail mini. Sangat diakui setiap blogger tentunya menginginkan perkembangan yang baik pada setiap blog yang dimilikinya, baik berupa trafik, tampilan, polularitas bahkan mungkin menjadikan blog tersebut sumber uang. Berbagai upaya dilakukan, salah satunya dengan memasang widget recent post agar memudahkan pembaca mengetahui postingan terbaru dari blog tersebut. Sebagian besar mungkin tidak terlalu memikirkan widget ini so menurut saya sih penting, apalagi dengan thumbnail gambar, kan lumayan bisa mempercantik alias ga ngbosenin diliatnya.. hehe... Bagi sobat yang tertarik  membuat widget recent post dengan thumbnail mini silahkan kopi kode dibawah ini dan ikuti tahapannya!

<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:3px;

padding:0px 0px;

height:229px;

}

#spylist ul{

width:270px;

overflow:hidden;

list-style-type: none;

padding: 0px 0px;

margin:0px 0px;

}

#spylist li {

width:270px;

padding: 2px 2px;

margin:0px 0px 5px 0px;

list-style-type:none;

float:none;

height:35px;

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:#700999;

font-size:9px;

height:12px;

overflow:hidden;

margin:0px 0px;

padding:0px 0px 1px 0px;

}

#spylist li img {

float:left;

margin-right:5px;

background:#EFEFEF;

border:0;

}

.spycomment{

overflow:hidden;

font-family:Tahoma,Arial,verdana, sans-serif;

font-size:7px;

color:#262B2F;

padding:0px 0px;

margin:0px 0px;

}

-->

</style>

    <script language='javascript'>

imgr = new Array();

imgr[0] = "http://3.bp.blogspot.com/--PQ80U1cY_o/UJpFVUVHV2I/AAAAAAAAEQE/-odi7_nu43o/s1600/logo+46px.png";

imgr[1] = "http://3.bp.blogspot.com/--PQ80U1cY_o/UJpFVUVHV2I/AAAAAAAAEQE/-odi7_nu43o/s1600/logo+46px.png";

imgr[2] = "http://3.bp.blogspot.com/--PQ80U1cY_o/UJpFVUVHV2I/AAAAAAAAEQE/-odi7_nu43o/s1600/logo+46px.png";

imgr[3] = "http://3.bp.blogspot.com/--PQ80U1cY_o/UJpFVUVHV2I/AAAAAAAAEQE/-odi7_nu43o/s1600/logo+46px.png";

imgr[4] = "http://3.bp.blogspot.com/--PQ80U1cY_o/UJpFVUVHV2I/AAAAAAAAEQE/-odi7_nu43o/s1600/logo+46px.png";

showRandomImg = true;

boxwidth = 300;

cellspacing = 4;

borderColor = "#232c35";

bgTD = "#000000";

thumbwidth = 34;

thumbheight = 34;

fntsize = 9;

acolor = "#666";

aBold = true;

icon = " ";

text = "Reply(s)";

showPostDate = false;

summaryPost = 50;

summaryFontsize = 9;

summaryColor = "#666";

icon2 = " ";

numposts = 10;

home_page = "http://pabk-4you.blogspot.com/";

limitspy=5

intervalspy=6000

</script>

    <div id="spylist">

        <script src='https://sites.google.com/site/pabk4you/Spy%20Effect.js' type='text/javascript'></script>

    </div>



-----------------------------------------------------------------------------------
* Catatan
Silahkan ganti kode yang berwarna biru dengan url blog sobat.
-----------------------------------------------------------------------------------

1. Login ke Dasbor sobat
Seperti ini
2. Pilih Rancangan kemudian pilih Edit HTML
3. Kemudian tambah elemen/gadget
4. Pilih HTML/JavaSripct
5. Paste kode di atas
6. Simpan

Lihat Hasilnya >>
Blok kemudian tekan tombol Ctrl dan huruf C pada keyboard secara bersamaan untuk copy artikel di atas. Bagi pengguna Google Chrome bisa menyimpan halaman ini dalam bentuk *pdf melalui tombol print/save di atas.! Bagi yang mau repost ulang harap untuk mencantumkan tautan/sumber!..

Jika Anda menyukai , Share melalui social media di atas (satu suka dari anda sangat berarti bagi kami. Tuliskan kritik dan saran anda pada form komentar di bawah! Ketikan email dan klik subcribe untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di Info [K-Moe].

Artikel relevan lainnya
Beri Komentar