Cloud Tag

Yippie...akhirnya aku bisa ngubah Widget Label ku supaya ngga menuh2xin halaman ini lagi. Yang tadinya semua ditulis kebawah sekarang jadi berupa Tag Cloud seperti dibawah ini :

Caranya bagaimana?? Ini dia....Tapi cara ini cuma berlaku buat pemakai Blogger dengan new template, jadi kalo belum yang ter-baru sebaiknya diupdate dulu.

Step2xnya adalah sebagai berikut :

1. Buka halaman "Add and Arrange Element". Dari halaman Dashboard klik Layout.
2. Kemudian tambahkan Gadget baru berupa Label. Atur sesuai keinginan, lalu simpan.
3. Pindah ke halaman "Edit HTML".
4. Sebagai backup klik Download Full Template, lalu save file tersebut.
5. Berikutnya check pilihan Expand Widget Templates.
6. Setelah itu search widget label seperti berikut :
   

   <b:widget id='Label1' locked='false' title='Labels' type='Label'/>
   .
   .
   .
   <b:include name='quickedit'/>
   </b:includable>
   </b:widget>



7. Selanjutnya timpa dengan coding berikut.
   

   <b:widget id='Label1' 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'>
   <div id='LabelDisplay'>
   </div>
   </div>
   
   <script language='javascript' type='text/javascript'>
   function zoomStyle() {
   var max = 0;
   var min = 10000;
   <b:loop values='data:labels' var='label'>
   if (<data:label.count/> &gt; max)
   max = <data:label.count/>;
   if (<data:label.count/> &lt; min)
   min = <data:label.count/>;
   </b:loop>
   var display = &quot;";
   <b:loop values='data:labels' var='label'>
   var temp = <data:label.count/> - min;
   var size = 80 + (temp * 100) / (max - min);
   display = display + &quot;<span style='font-size:" + size + "%'><a expr:href='data:label.url + "?max-results=100"' style='text-decoration:none;'><data:label.name/></a></span> &quot;;
   </b:loop>
   
   obj = document.getElementById(&#39;LabelDisplay&#39;);
   obj.innerHTML = display;
   }
   
   zoomStyle();
   </script>
   
   <b:include name='quickedit'/>
   </b:includable>
   </b:widget>
   

8. Kemudian klik tombol Preview untuk melihat hasilnya. Kalau sudah OK, jangan lupa Save Template dan silahkan menikmati hasilnya. Kalau gagal, silahkan buka Template awal yang telah didownload sebelumnya dengan menggunakan notepad lalu timpa coding yang ada dengan isi file tersebut.
   

Selamat mencoba.