Life in your style ....

Pernah liat tag cloud/label cloud yang bisa muter-muter kalo diarahin pake kursor? Yup, itu yang bakal saya bagiin kali ini. Blogumus, ini adalah nama widget yang akan kita pasang. Sebenarnya widget ini dibuat untuk pengguna wp, tapi berterimakasihlah pada bloggerbuster.com yang sudah memodifikasinya untuk kita (para blogger) gunakan.

<b:section class='sidebar' id='sidebar' preferred='yes'>

Pertama, masuk ke perancangan html, cari kode yang kurang lebih seperti ini: Lalu taruh kode berikut di bawah kode di atas:

<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://sites.google.com/site/bloggerustemplatus/code/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://sites.google.com/ site/bloggerustemplatus/code/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");
//hilangkan garis miring dibawah untuk mode transparan
//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>

Silahkan cek apakah sudah terinstal dengan benar? Sekarang penjelasan singkat untuk memodifikasi widget diatas biar pas ama layout blog kita,

var so = new SWFObject("http://sites.google.com/site/
bloggerustemplatus/code/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");

240 adalah lebar, 300 adalah tinggi, #ffffff adalah kode warna latar (dalam hex)

so.addVariable("tcolor", "0x333333");

333333 adalah kode hex buat warna tulisan, inget cuma ganti angkanya, ‘0x’ gak boleh hilang,

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>");

Angka 12 adalah besar kecilanya tulisan.

Nah sekian tutorial singkat tentang tag cloud yang bisa berputar-putar, silahkan kembali berkunjung lain kali :)