Cara Memasang Tag Clouds Animasi di Blog

Apakah anda tidak bosan dengan tampilan widget tag label yang anda gunakan? Kalo kamu bosan dengan widget yang standar aja, sekarang ada widget tag cloud yang bisa memberikan pariasi blog kamu. Widget tag cloud ini terkesan lebih elegan karena menyajikan animasi gerak jika cursor diarahkan ke widget tersebut. Selama ini mungkin anda hanya mengenal tag cloud standar dengan kata kunci yang hanya berbeda pada besaran hurufnya saja.

Bagi yang berminat memasangnya silahkan ikuti tips di bawah ini :

• Seperti biasa. Login ke Blogger
• Setelah itu klik Design -> Edit HTML 
• Klik Download Full Template untuk membackup template anda
• Cari kode <b:section class='sidebar' id='sidebar' preferred='yes'>
• Kalau sudah ketemu letakkan kode berikut tepat dibawah kode yang diatas

<b:widget id='Label88' locked='false' title='Tag Cloud' 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.tipsbloging.com/'>tipsbloging.com</a> and <a href='http://situs27.blogspot.com'>situs27</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;180&quot;, &quot;180&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>

•  Keterangan : Angka 180 menunjukkan panjang tag cloud dan angka 180 menunjukkan tinggi tag cloud. Silahkan diganti nilainya sesuai dengan ukuran sidebar template anda.
  
  Sedangkan kode ffffff menunjukkan warna background dari tag clound. Angka 333333 menunjukkan warna teks dan angka 12 menunjukkan ukuran teks. Silahkan diganti sesuai keinginan.  
• Jika sudah, Klik Save Template. Selesai

~Good Luck ~

Artikel Terkait :