Jumat, 24 Oktober 2008

Membuat Tag Cloud Cumulus Pada Blogger

Tag Cloud Cumulus pada blogger disebut juga Blogumus. Aslinya dibuat untuk WP oleh tuan ini, lalu oleh nona ini diutak-atik hingga bisa diterapkan pada blogger. Lihat contoh tag cloud-nya (label) pada blog ini (aku juga yang buat). Aku sendiri nggak buat karena labelnya masih semrawut (terlalu banyak/belum disederhanakan).

Pertama seperti biasa login - layout - edit html - expand widget templates, lalu cari tag dibawah ini (gampangnya pencet Ctrl F, lalu isi tag dibawah ini pada kotak pencarian)

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

Kalau nggak ketemu tag tersebut, coba hilangkan dikit-dikit dari bagian akhir. Kalau sudah ketemu, tinggal copy-paste kode dibawah ini tepat dibawah tag tersebut :

<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(&quot;http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf&quot;, &quot;tagcloud&quot;, &quot;240&quot;, &quot;300&quot;, &quot;7&quot;, &quot;#ffffff&quot;);
// uncomment next line to enable transparency
//so.addParam(&quot;wmode&quot;, &quot;transparent&quot;);
so.addVariable(&quot;tcolor&quot;, &quot;0x333333&quot;);
so.addVariable(&quot;mode&quot;, &quot;tags&quot;);
so.addVariable(&quot;distr&quot;, &quot;true&quot;);
so.addVariable(&quot;tspeed&quot;, &quot;100&quot;);
so.addVariable(&quot;tagcloud&quot;, &quot;<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>&quot;);
so.addParam(&quot;allowScriptAccess&quot;, &quot;always&quot;);
so.write(&quot;flashcontent&quot;);
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>


Save templates, Selesai sudah, lalu tinggal preview, tag cloud ini muncul pada bagian atas sidebar, ntar tinggal memindahkannya kelokasi yang kamu inginkan. Selanjutnya jika ingin merubah dimensi panjang dan lebar, besar font dan background tinggal cari tag ini pada tag yang dicopas tadi:

var so = new SWFObject(&quot;http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf&quot;, &quot;tagcloud&quot;, &quot;240&quot;, &quot;300&quot;, &quot;7&quot;, &quot;#ffffff&quot;);

Ganti default : 240 (lebar), 300 (tinggi), 7 (ukuran font), dan #ffffff (warna background) dengan selera kamu. Sedangkan warna huruf tinggal cari kebawah dikit lagi yaitu : 333333 juga tinggal ganti jika mau.