Senin, 04 Juli 2011

Cara Membuat Label Cloud.


Label cloud adalah animasi yang dikelola dengan javascript untuk membuat label sebuah blog yang sejatinya statis menjadi dinamis, indah dan flexibel. Label cloud seperti label blog pada umunya bertujuan membuat pengunjung blog tahu tentang isi sebuah blog saat membuka sebuah halaman. Jika blog adalah sebuah buku, maka label adalah daftar isi sebuah blog. Label cloud sangat penting, selain untuk merancang kategori sebuah tulisan, mengelompokkan beberapa tulisan ke dalam sebuah judul bernama Label, maka label cloud membuat label itu menarik untuk diketahui.
Cara membuat label cloud sangat mudah:
Untuk memasang label cloud animasi pada sidebar seperti yang anda lihat pada gambar yang di tunjukkan di atas, anda hanya perlu ikuti beberapa langkah ini:

Tapi sebelum mulai, akan lebih aman jika template anda didownload dulu, untuk menghindari kesalahan pengeditan label cloud.

Langkah 1

Log in blog => Dashboard => Design => Edit HTML.

Langkah 2

Petama, klik F3 pada keyboard untuk mencari lalu kopi dan paste kode berikut:<b:section class='sidebar' id='sidebar' preferred='yes'> atau <b:section-contents id='sidebar-right-1'>(untuk Template Designer)pada ruang Find. Seterusnya, tekan kekunci Enter.

Langkah 3

Salin kode di bawah dan paste tepat di bawah kode <b:section class='sidebar' id='sidebar' preferred='yes'> atau <b:section-contents id='sidebar-right-1'>

<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'>
<center>
&lt;object type="application/x-shockwave-flash" data="https://sites.google.com/site/javascript10/tagcloud.swf" width="100%" height="200" allowscriptaccess="always" &gt;
&lt;param name="movie" value="https://sites.google.com/site/javascript10/tagcloud.swf" /&gt;
&lt;param name="bgcolor" value="#ffffff" /&gt;
&lt;param name="flashvars" value="tcolor=0x000000&amp;mode=tags&amp;distr=true&amp;tspeed=100&amp;tagcloud=&lt;tags&gt;
<b:loop values='data:labels' var='label'>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url' style='11'><data:label.name/></a>
</b:loop>
&lt;/tags&gt;" /&gt;
</center>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>


Terakhir, klik Preview dan jika tidak ada pesan Error yang terpapar, klik saja Save.

Tambahan:

1. Untuk menukar warna background, edit kode #ffffff yang di bold dengan warna pilihan anda.

Contoh: #000000 (warna hitam)

2. Untuk menukar warna font,edit kode 000000 yang di bold dengan warna pilihan anda. selesai.....!!

0 komentar:

Posting Komentar