Cara membuat Widget Recent Posts(Artikel terbaru) Dengan Thumbnail

Assalamualaikum wr wb

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

 
Sebelumnya anaa sudah pernah posting cara memasang recent post atau widget postingan terbaru, untuk kali ini ada sedikit perbedaan, widget recent post ini disertai dengan thumbails dan jumlah komentar, anaa pun menggunakan widget ini untuk blog ini.
Sudah tahu cara membuat widget recent post with thumbails ini? Kalau sudah, ya ini untuk yang belum tau aja.
Oke langsung cara membuat widgt recent post ini:
1. Dalam keadaan loggin, klik Layout (Tata Letak)
2. Klik Page Elemens (Elemen Halaman)=> Add a gadget (Tambah Gadget)=> HTML/Javascript. Copi dan paste pada content code berikut:

<script language="JavaScript">
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJW8gzuvtQkN82OklBAaxc4rZASd4nCTCIJQuxP_kJtdw4ctlc_C6e2inJj6VIhtPM6YgwYHmmfphBzrkxRtOvdRntZOjKgvHADn1MSEAv-Y0NUmyC5Zyl54oR-0JrqkPvHQl142iV96g/";
imgr[1] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJW8gzuvtQkN82OklBAaxc4rZASd4nCTCIJQuxP_kJtdw4ctlc_C6e2inJj6VIhtPM6YgwYHmmfphBzrkxRtOvdRntZOjKgvHADn1MSEAv-Y0NUmyC5Zyl54oR-0JrqkPvHQl142iV96g/";
imgr[2] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJW8gzuvtQkN82OklBAaxc4rZASd4nCTCIJQuxP_kJtdw4ctlc_C6e2inJj6VIhtPM6YgwYHmmfphBzrkxRtOvdRntZOjKgvHADn1MSEAv-Y0NUmyC5Zyl54oR-0JrqkPvHQl142iV96g/";
imgr[3] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJW8gzuvtQkN82OklBAaxc4rZASd4nCTCIJQuxP_kJtdw4ctlc_C6e2inJj6VIhtPM6YgwYHmmfphBzrkxRtOvdRntZOjKgvHADn1MSEAv-Y0NUmyC5Zyl54oR-0JrqkPvHQl142iV96g/";
imgr[4] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJW8gzuvtQkN82OklBAaxc4rZASd4nCTCIJQuxP_kJtdw4ctlc_C6e2inJj6VIhtPM6YgwYHmmfphBzrkxRtOvdRntZOjKgvHADn1MSEAv-Y0NUmyC5Zyl54oR-0JrqkPvHQl142iV96g/";
showRandomImg = true;
boxwidth = 298;
cellspacing = 8;
borderColor = "#ffffff";
bgTD = "#000000";
thumbwidth = 40;
thumbheight = 40;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = false;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 5;
home_page = "http://www.NAMABLOGMU.blogspot.com/";
</script>
<script src="http://tipstrikblogging.googlecode.com/files/RecentPostThumbnail.js" type="text/javascript"></script>

Keterangan:

• boxwidth-Lebar widget (silahkan sesuaikan dengan sidebar sobat)
• bgTD-Warna background (Sesuaikan sesuai template sobat)
• borderColor-Warna Border (Sesuaikan dengan warna favorit sobat)
• thumbwidth& thumbheight-Lebar dan tinggi gambar
  fntsize-ukuran judul postingan
• acolor-Warna judul post
• abold-untuk tebalkan huruf
• numpost-jumlah post yang ingin ditampilkan
• home-page: alamat blog anda

Nah silahkan mengedit sesuai selera anda, untuk melihat code warna bisa merujuk kesini
Jangan lupa save/simpan.

Demikian tutorial cara memasang widget recent post with thumbnails dan total comments. Semoga bermanfaat!

ٱلْحَمْدُ لِلَّهِ رَبِّ ٱلْعَٰلَمِين 

 

semoga bermanfaat

wassalamualaikum wr wb

 

Sumber ; http://www.tipstrikblogging.com/2009/11/widget-recent-posts-postingan-terbaru.html