BREAKING

Tuesday 22 March 2011


Cara membuat Label Could Berputar


[blogumulus[6].jpg]Label Pada Blog Menurut saya adalah pengelompokkan/penyusunan artikel blog dalam satu kategori, biasanya di pasang di sidebar atau di bagian bawah template tergantung pada pemilk blog meletakkanya. Pada saat ini Bentuk/Model Label Blog Ada 3 Macam yaitu Label Standar dari Platfrom BLOG,Label Umum Cloud dan Label Berputar. Label cloud berputar ini lebih menarik Karena gerakannya yang dinamis gerakanya mengikuti cursor dan pastinya akan menjadi perhatian pada para pengunjung blog kita nantinya....(sample lihat di blog saya sidebar sebalh kiri)
Membuat label cloud berputar menurut saya membutuhkan kode HTML yang lumayan panjang
Langsung saja langkah I ,O ya saran saya back dulu templat sobat sebelum mengedit,.,klo saya di copy dulu kode HTML paste ke notepad /word terserah…
I. Langkah Pertama

  1. Login ke Blogger dengan ID sobat.

  1. Klik Tata Letak

  1. Klik tab Edit HTML

  1. Download dulu template sobat dengan mengklik Download Template Lengkap
  1. Kemudian klik button Expand Template Widget dan cari kode yg seperti ini : 

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

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

  1. Kemudian Simpan Template.


II. Langkah Kedua 

Angka "240" adalah lebar kolom
Angka "300" adalah tinggi kolom
Sedangkan #ffffff adalah kode untuk backgroud

  • Merubah warna font, untuk kode warna bisa sobat lihat diphotoshop
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>");

Jika dalam membuat label cloud ini tidak berfungsi ganti label text menjadi label cloud. pada widget label sobat
 Lihat hasilnya…!!
Terima kasih kepadaroytanck dan amanda fazani yang telah menyediakan javascript untuk label cloud ini.

Post a Comment

 
Customized By © 2014 /Devil-999/