anda pengguna Wordpess tentu tidak asing lagi dengan tag cloud
wp-cumulus. Ternyata setelah dimodifikasi, wp-cumulus dapat juga
dipasang di blogger. Namanya menjadi Blogumus. Contohnya bisa dilihat di sidebar sebelah kanan di blog ini.
Cara membuatnya cukup mudah, buktinya orang lugu seperti saya pun bisa :-)
Ikuti saja langkah-langkahnya berikut ini :
1. Log in ke blogger
2. Dari dashboard, klik Lay out, kemudian edit HTML, jangan lupa klik tanda expand widget
3. Cari kode di bawah ini (untuk memudahkan, tekan ctrl+F untuk memunculkan menu Find, kemudian masukkan kode yang dicari).
<b:section class='sidebar' id='sidebar' preferred='yes'>
4. Setelah ketemu, copy kode di bawah ini, kemudian tempelkan (paste) dibawah kode yang tadi.
<b:widget id='Label99' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='http://halotemplates.s3.amazonaws.com/wp-cumulus-example/swfobject.js' type='text/javascript'/>
<div
id='flashcontent'>Blogumulus by <a
href='http://www.roytanck.com/'>Roy Tanck</a> and <a
href='http://www.bloggerbuster.com'>Amanda
Fazani</a></div>
<script type='text/javascript'>
var
so = new
SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf",
"tagcloud", "240",
"300", "7",
"#ffffff");
// uncomment next line to enable transparency
//so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0x333333");
so.addVariable("mode", "tags");
so.addVariable("distr", "true");
so.addVariable("tspeed", "100");
so.addVariable("tagcloud",
"<tags><b:loop values='data:labels'
var='label'><a expr:href='data:label.url'
style='12'><data:label.name/></a></b:loop></tags>");
so.addParam("allowScriptAccess", "always");
so.write("flashcontent");
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
5. Klik Save.
Selanjutnya kita bisa mengubah warna, ukuran, dan mengatur letaknya.
Setting secara default adalah sebagai berikut :
- Lebar 240px
- Tinggi 300px;
- Warna Backgrund : Putih
- Warna teks : abu-abu
- Ukuran Font "12"
Mengubah ukuran Tinggi dan Lebar :
Cari kode ini :
var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");
Ukuran
lebar (saat ini 240px) diberi warna merah dan tinggi (300px) terlihat
berwarna biru. Angka-angka itu adalah dalam satuan pixel. Kita bisa
mengubahnya sesuai kebutuhan, menyesuaikan sidebar di blog kita.
Mengubah warna background
Masih menggunakan kode di atas, background berwarna putih ditunjukkan dengan kode #ffffff
var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");
Kita bisa mengubahnya dengan warna lain misalnya warna merah muda. Ganti kodenya #ffffff dengan #ff0000. Cobalah ganti dengan kode-kode warna lainnya.
Mengubah warna text
Secara default, text berwarna abu-abu ( hex value #333333). Kita bisa menggantinya dengan mengubah kode di bawah ini.
so.addVariable("tcolor", "0x333333");
Misalnya mau kita ubah menjadi hitam, ganti 333333 menjadi 000000 (Ingat, Ubah kode angkanya saja, tidak perlu menuliskan # )
Mengatur ukuran font
cari kode berikut ini :
so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");
Ukuran font saat ini adalah 12. Kita bisa mengubahnya lebih besar atau lebih kecil sesuai kebutuhan.
Selesai... Mudah bukan?
Untuk menampilkan blogumus diperlukan Flash Player . Kita bisa mendapatkannya dengan mengunduhnya di Adobe.
Terima kasih buat Mas Roy Tanck dan Mbak Amanda Fazani
Tidak ada komentar:
Posting Komentar