Cara Membuat Widget Recent Post with Thumbnails

21 Maret 2010 | komentar

Di tengah rasa penasaran melihat posisi blog ini dengan keyword Stop Dreaming Start Action yang naik turun seperti celana, saya sempatkan diri menyajikan tutorial blogging. Cuma, kali ini yang simpel saja. Yakni cara membuat widget recent post with thumbnails seperti tampak di sidebar blog ini. Widget tersebut kalau tak salah hasil kreasi Bloggertricks. Adanya foto/gambar pada widget itu membuat tampilannya tampak manis. Saya tak tahu pasti apakah widget semacam itu sudah lama beredar atau dengan kata lain sudah jadul. Jika ya, berarti saya yang ketinggalan jaman...kekekek!

Cara membuatnya ternyata gampang.


1. Masuk Layout---->Add a Gadget

2. Pilih 'HTML/JavaSript'

3. Masukkan skrip berikut ini:

<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;
boxwidth = 278;
cellspacing = 5;
borderColor = "#ffffff";
bgTD = "#000000";
thumbwidth = 40;
thumbheight = 40;
fntsize = 12;
acolor = "#006699";
aBold = true;
icon = " ";
text = "comments";
showPostDate = false;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 5;

home_page = "http://wawanwae.blogspot.com/";
</script>
<script src="http://myblogtalk.com/bloggertemplates/js/recentposts_thumbnail.js" type="text/javascript"></script>

4. Simpan. Selesai.

Ket:
- Yang tercetak merah ganti dengan URL blog anda.
- boxwidth (lebar widget) dan cellspacing (space antar cells) angkanya bisa diganti sesuai kebutuhan).
- thumbwidth dan thumbheight (lebar dan tinggi gambar thumbnail, bisa dibah-ubah)
- fntsize: ukuran huruf. Sesuaikan kebutuhan.
- acolor: warna tulisan.
- aBold: tulisan dicetak tebal. Jika ingin yang biasa, ganti 'true' jadi 'false'.
- numposts: banyaknya postingan yang diperlihatkan.

Selamat mencoba.
Share this article :

Posting Komentar

 
Support : Zack's Demirel | Joker Kielbiest | X-Tea'Cker™ on Facebook
Copyright © 2011. X-Tea'Cker™ - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger