Jumat, 28 Agustus 2009

Membuat Label Berputar (Clouds label)

Hai para blogger..
Gimana nih kabar Blognya??
sehat??he2x
Kali ini saya akan memberikan cara pembuatan Label Berputar, atau yang sering disebut dengan label clouds.
Yups..Langsung kita mulai saja. Nih langkah-langkahnya:
1. Log in ke blog anda
2. Klik tab layout (tata letak), lalu pilih edit html. (centang pada expand template widget)
3. Cari kode: <b:section class='sidebar' id='sidebar' preferred='yes'>
lalu copy seluruh kode di bawah ini, kemudian letakkan/ paste tepat di bawah kode tadi:
<b:widget id='Label100' 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://h1.ripway.com/Anjar91/swf.object.js' type='text/javascript'/>
<div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://www.marewa.info'>marewa</a></div>
<script type='text/javascript'>
var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "180", "100", "7", "#000000");
// uncomment next line to enable transparency

//so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0xffffff");
so.addVariable("mode", "tags");
so.addVariable("distr", "true");
so.addVariable("tspeed", "100");
so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='24'><data:label.name/></a></b:loop></tags>");
so.addParam("allowScriptAccess", "always");
so.write("flashcontent");
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>


 Nih keterangannya:
Tulisan-tulisan yang berwarna putih..
1. tulisan http://h1.ripway.com/Anjar91/swf.object.js merupakan alamat file java script yang dapat anda copy lalu upload ke hosting milik anda.
2. Angka 180 merupakan angka untuk lebar(width) kotak label clouds nya, sedangkan angka 100 merupakan angka untuk tinggi(height) dari label clouds, gantilah angka-angka tersebut sesuai dengan keinginan anda, namun tetap memperhatikan lebar sidebar anda.
3. Kode warna #000000 merupakan kode warna untuk warna background(lay out) label clouds, gantilah kode tersebut dengan warna pilihan anda. untuk kode warna lihat disini.
4. Kode ffffff merupakan kode warna putih dari tulisan pada label clouds tersebut, gantilah dengan warna yang anda inginkan.
5. Angka 100 merupakan kecepatan perputaran tulisan dalam label clouds, semakin besar angkanya maka tulisan dalam label clouds tersebut akan semakin cepat berputarnya.dan sebaliknya, semakin kecil angkanya, maka akan semakin lambat pula tulisan tersebut untuk berputar.
6.  Angka 24 merupakan ukuran tulisan yang akan muncul di dalam label clouds, semakin besar angkanya, semakin besar tulisan yang muncul.

Jika sudah, lihatlah hasilnya sekarang...

3 komentar:

  1. salam kenal. . .

    .keren nih blognya...

    di tunngu kunjungan ma komen baliknya ya. .

    BalasHapus
  2. manteb gan, saya coba nanti kalau bisa

    BalasHapus