Trick Blog | Recent Post With Thumbnail Horizontal

Halo pembaca blog kukuhcdh sekalian, mari kita bersama sama membuat "Recent Post With Thumbnail". Sebagai contoh, anda bisa membuka blog saya yang sangat berantakan dan tak terurus pada blog yang satu ini "LabCakra". Kalau anda  ingin melihat gambarnya secara langsung, berikut screenshotnya

Menarik bukan? Walaupun tanpa animasi jQuery pada post saya pada zaman dulu kala yakni "Recent Post Animated With jQuery"
Pada Recent Post kali ini, saya lebih menekankan kepada ringannya blog saat dibuka, karena pada saat kita menggunakan Recent Post yang teranimasi dengan jQuery tentu saja akan sedikit lama untuk dimuat karena harus memuat script jQuerynya.
Dan, pada Recent Post With Thumbnail ini, saya menggunakan Script sederhana yang tidak lama untuk dimuat di blog kesayangan anda.

Oke, Berikut Step-By-Step nya

1. Login ke Blogger --> Pilih Blog anda --> Layout
2. Click "Add a Gadget" --> HTML/JavaScript
3. Masukkan script berikut

<center><script language="JavaScript">
imgr = new Array();
imgr[0] = "http://i897.photobucket.com/albums/ac180/kukuhcdh/no_image1.gif";
imgr[1] = "http://i897.photobucket.com/albums/ac180/kukuhcdh/no_image1.gif";
imgr[2] = "http://i897.photobucket.com/albums/ac180/kukuhcdh/no_image1.gif";
imgr[3] = "http://i897.photobucket.com/albums/ac180/kukuhcdh/no_image1.gif";
imgr[4] = "http://i897.photobucket.com/albums/ac180/kukuhcdh/no_image1.gif";
imgr[5] = "http://i897.photobucket.com/albums/ac180/kukuhcdh/no_image1.gif";
imgr[6] = "http://i897.photobucket.com/albums/ac180/kukuhcdh/no_image1.gif";
imgr[7] = "http://i897.photobucket.com/albums/ac180/kukuhcdh/no_image1.gif";
imgr[8] = "http://i897.photobucket.com/albums/ac180/kukuhcdh/no_image1.gif";
imgr[9] = "http://i897.photobucket.com/albums/ac180/kukuhcdh/no_image1.gif";
showRandomImg = true;

tablewidth = 900;
cellspacing = 2;
borderColor = "#eeeeee";
bgTD = "transparant";

imgwidth = 110;
imgheight = 100;

fntsize = 12;
acolor = "Black";
ahover = "#444444";
aBold = true;
icon = " ";

text = "comments";

showPostDate = false;

summaryPost = 100;
summaryFontsize = 10;
summaryColor = "gray";
icon2 = " ";

numposts = 5;

home_page = "http://kukuhcdh.blogspot.com/";

</script>
<script src="https://sites.google.com/site/kukuhcdh/home/javascript/recentposts_horizontal_title_below_no.js" type="text/javascript"> </script></center>

***---***
Ganti text yang bewarna merah dengan alamat blog anda.
Ganti nominal yang bewarna biru untuk menentukan banyaknya jumlah post yang akan ditampilkan.
Ganti nominal yang bewarna hijau untuk banyaknya huruf yang dimuat untuk setiap post (Read More)
Silahkan berkostumisasi sendiri ya :)

Sekian dari trik blog saya, mohon maaf apabila ada kesalahan.. Sekian terima kasih...

Tweet

Artikel Terkait: