Membuat Recent Post dengan Thumbnails

Kelihatannya setelah membahas tutorial cara membuat related post dengan thumbnails terasa kurang dah kalau maslah recent post juga gak dibahas. Memang sih untuk maslah recent post ini sudah di bahas pada postingan yang lalu, yaitu dengan judul Cara Membuat Recent Post, namun bedanya dengan yang ingin kita bahas kali ini adalah cara membuat recent post alias postingan terbaru disertai tampilan gambar/thumbnails. Agar gak kelamaan, silahkan ikuti langkah2 berikut

1. Login ke blogger, pilih tata letak, lalu tambah gadget HTML

2. Taruh kode berikut di dalamnya dan jangan lupa disimpan

<script language="JavaScript">

imgr = new Array();

imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9DMRrDlb2gJk5zp3yxIvVt1oSOqR2XD4o2HEE6CHXrBNFjWHPHl9G-1H781SQg6e8y0dBA8mjPxe-k3HnlS7t7Ql_qQFfOJJiluR8CN1R8JvMsugUhujdkCuHro67kfCQsyrhToILUCU/";

imgr[1] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9DMRrDlb2gJk5zp3yxIvVt1oSOqR2XD4o2HEE6CHXrBNFjWHPHl9G-1H781SQg6e8y0dBA8mjPxe-k3HnlS7t7Ql_qQFfOJJiluR8CN1R8JvMsugUhujdkCuHro67kfCQsyrhToILUCU/";

imgr[2] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9DMRrDlb2gJk5zp3yxIvVt1oSOqR2XD4o2HEE6CHXrBNFjWHPHl9G-1H781SQg6e8y0dBA8mjPxe-k3HnlS7t7Ql_qQFfOJJiluR8CN1R8JvMsugUhujdkCuHro67kfCQsyrhToILUCU/";

imgr[3] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9DMRrDlb2gJk5zp3yxIvVt1oSOqR2XD4o2HEE6CHXrBNFjWHPHl9G-1H781SQg6e8y0dBA8mjPxe-k3HnlS7t7Ql_qQFfOJJiluR8CN1R8JvMsugUhujdkCuHro67kfCQsyrhToILUCU/";

imgr[4] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9DMRrDlb2gJk5zp3yxIvVt1oSOqR2XD4o2HEE6CHXrBNFjWHPHl9G-1H781SQg6e8y0dBA8mjPxe-k3HnlS7t7Ql_qQFfOJJiluR8CN1R8JvMsugUhujdkCuHro67kfCQsyrhToILUCU/";
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://t4belajarblogger.blogspot.com/";

</script>

<script src="http://sites.google.com/site/t4belajarblogger/js_t4belajarblogger/recentposts_thumbnail.js" type="text/javascript"></script>

Nah bagian2 yang harus teman2 atur agar sesuai dengan blognya tman2 adlh sebagai berikut:

-boxwidth = lebar widget recent post

-cellspacing = spasi masing2 cells, disesuaikan.

-borderColor = Warna border/garis tepi [pilih warna di sini]

-thumbwidth dan thumbheight = silahkan untuk disesuaikan dengan keadaan blog anda.

-fntsize = GD font/tulisan

-acolor = Wrna juudl post pada recent post [pilih warna di sini]

-aBold = tebal judul postingan yg tampil pada widgwt recnt post

-Numpost = jumlah postingan yg akan muncul pada recent post thumbnails widget

-tulisan biru tebal = itu harus diganti dengan alamat blognya tman2


Biasanya beberapa rekan blogger ada yg mengalami beberapa maslah yg tdk diinginkan, seperti widget tersebut gak mau tampil, maka kemungkinan ada beberapa langkah lagi untuk mensetting blog anda agar widget tersebut bisa tampil:

1. Pergi ke halaman pengaturan >> pilih opsi feed situs

2. lalu pada bagian "Izinkan Feed Blog" silahkan untuk menyetingnya menjadi: Penuh

3. Untuk bagian "Posting URL Pengubahan Arah Feed", silahkan dikosongkan.

4. simpan hasil setelan anda. Silahkan lihat hasilnya




Semoga Bermanfaat []

Tags: cara membuat recent post thumbnails, postingan terbaru thumbnails, recent post bergambar, postingan terbaru bergambar, kode HTML recent post thumbnails, script recent post thumbnails