Friday, June 12, 2009

Tag Cloud Widget: Blogumulus

Hohohooho... Blogumulus, nama yang bagus sebagus bentuknya. blogumulus adalah sebuah tag widget yang mempunyai keunikan karena bisa berputar-putar jika Anda menempelkan kursor pada salah satu tulisan di dalamnya. Blogumulus ini merupakan salah satu widget yang sedang hot-hotnya dipakai oleh para blogger. Contohnya bisa Anda lihat di Label Blog saya ini. Ingin tahu bagaimana cara pasangnya di blogspot? Langsung kita praktekkan saja...

1. Masuk ke bagian Layout atau tata letak

2. Kemudian pilih Edit HTML

3. Jangan lupa back up dulu template Anda untuk menghindari sesuatu yang tidak diinginkan.

4. Kemudian pada Edit HTML, centang di bagian kanan atas tulisan Expand Template Widget.

5. Kemudian cari kode di bawah ini.

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

6. Kemudian masukkan kode di bawah ini tepat 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://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(&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;);
// 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>

7. Simpan Template Anda dan lihat hasilnya...

Namun, yang harus diingat adalah browser Anda harus sudah dilengkapi dengan flash player. Sebab, blogumulus ini menggunakan kombinasi java script dan animasi flash.

4 comments:

  1. flash player tu apa pen???

    ReplyDelete
  2. Makasih, lagi mo dicoba nih. Kebanyakan kode tag cloud yang saya coba, gak berhasil. Error in parsing. Sudah dicoba-coba edit, gak bisa juga. Moga-moga yang ini bisa, soalnya tag cloudnya keren.

    ReplyDelete
  3. informatif, jelas dan gamblang. aku lg blajar buat blog ikut tak coba yo mas. tks

    ReplyDelete
  4. di HTML ku gak ada gan :(
    padahal pengen banget :3

    ReplyDelete