membuat label keren cloud berputar di blog

Ada kepengen buat label di blog anda/website anda, Label adalah pengelompokkan artikel blog dalam satu kategori, dan kemudian biasa di pasang di sidebar atau mungkin di bagian bawah template. Saat ini model atau bentuk label ada 3, label umum atau yang biasa (standard), label cloud, dan label clound berputar Yang akan kita bahas sekarang adalah memasang label cloud berputar di blog.

Label cloud berputar ini terlihat lebih menarik karena gerakannya yang dinamis sehingga dapat menarik perhatian para pengunjung blog kita dan label cloud ini gerakannya juga mengikuti cursor.  

Contohnya hasilnya seperti ini..

Gimana bagus kan kalo tertarik anda bisa lakukan langkah-langkah seperti berikut.

I. Langkah Pertama

1. Login ke Blogger dengan ID sobat.
   
2. Klik Tata Letak
   
3. Klik tab Edit HTML
   
4. Download dahulu template sobat dengan mengklik Download Template Lengkap
   
5. Kemudian klik button Expand Template Widget dan cari kode yg seperti ini : 

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


6. Copy kode berikut ini setelah kode diatas : 



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


7. kemudian simpan templatesnya dan lihat hasilnya....

II. Langkah Kedua 

• Mengubah lebar dan tinggi kolom serta warna bandground
  
  Angka "240" adalah lebar kolom
  Angka "300" adalah tinggi kolom
  Sedangkan #ffffff adalah kode untuk backgroud
  
  
  
• Merubah warna font, untuk kode warna
  
  so.addVariable("tcolor", "0x333333");
  
  
• Merubah ukuran font
  
  so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");

 

Cuma itu saja mudahan bermamfa'at.

Posted in: tips and trick,tips and trick bloging