Kamis, 31 Desember 2009

Cara membuat Tag Comulus pada Blogspot/Blogger


Akhirnya kesampaian juga keinginan saya untuk mengganti tampilan label menjadi lebih yahud. Saya tertarik mengubah tampilan label blog menjadi lebih dinamis, bergerak menyesuaikan dengan gerakan kursor mouse ketika diarahkan ke space label tersebut. Dalam dunia blogging, label yang seperti itu biasa disebut Tag Cloud Cumulus atau Blogumus. Dengan menggunakan tampilan ini, blog anda akan terlihat lebih dinamis dan tidak kaku. Anda tertarik untuk mencobanya? Silahkan ikuti langkah-langkah berikut :



Langkah Pertama :

  1. Login di Blogger.com
  2. Setelah sampai di menu dasbor/dashboard, pilih menu Tata Letak>Edit HTML
  3. Di menu Edit HTML, centang kotak "expand widget template" jangan lupa, BACKUP!!
  4. Cari script berikut:
 <b:section class='sidebar' id='sidebar' preferred='yes'>

(untuk mempermudah mencarinya, tekan CTRL+F (find)) 

Langkah  Kedua

Copy Code berikut, setelah itu Paste tepat persis di bawah kode sebelumnya tadi:


<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> 


Finish. Simpan template dan langsung aja cek tampilan Blog anda. Apabila anda kurang puas karena sizenya terlalu besar atau terlalu kecil, anda bisa melakukan sedikit modifikasi. Begini caranya :

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

Angka 240 menunjukkan lebar dan angka 300 adalah tingginya dan #ffffff adalah warna background. Anda bisa menggantinya sesuka hati menyesuaikan dengan template yang anda gunakan.  

 


 


 





Tidak ada komentar:

Posting Komentar