readbud - get paid to read and rate articles

Jumat, 09 April 2010

Membuat Tag Cloud Comulus Animasi Flash

Ada cara yang laen untuk memunculkan label atau category yang kita buat tanpa harus menghabiskan tempat. Yatu dengan tag cloud cumulus. Dengan model Flash animasi ini memang sangat asyik dipandang, walau memang dengan JavaScript akan membuat blog agak agak berat loadingnya
Pertama Untuk membuatnya mari kita ikuti langkah-langkah berikut:
1. Login ke account blogger kamu
2. Pilih layout > add gadget pada sidebar kamu untuk membuat elemen halaman baru
3. Pilih Label,


4. Pada Title kamu isikan judul widget kamu, misal: kategori, daftar ini, labels, dsb. Pada pilihan sorting kamu bisa memilih Alphabetically untuk mengatur labels kamu secara abjad dan By Frequency untuk mengatur labels kamu dari jumlah artikel terbanyak. Tampilan Previewnya akan terlihat.
5. Jangan lupa Save dan lihat hasilnya.
Catatan: Lima step diatas hanya buat kamu yang belum pernah membuat widget kategori labels, jika sudah kamu bisa langsung ke step berikut.
6.Login kedalam blogger dengan user id anda.
7.Masuk ke Dashboard Layout > Edit HTML dan klik Expand Template Widget
8.Jangan lupa untuk selalu mem-backup template anda sebelum memodifikasinya.
9. Cari kode dibawah ini :

<b:section class='sidebar' id='sidebar' preferred='yes'>
10.Kemudian copy dan paste kode di bawah ini tepat di bawah kode no. 9

<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 ("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");
// uncomment next line to enable transparency
//so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0x333333");
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='12'><data:label.name/></a></b:loop></tags>");
so.addParam("allowScriptAccess", "always");
so.write("flashcontent");
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

11.Simpan template anda. Selesai!!!

Ketika anda melihat blog anda kembali, secara otomatis tag cloud cumulus ini akan tertampil di sidebar blog anda. Secara default widget ini akan tertampil dengan keterangan sebagai berikut:
• Width = 240px
• Height = 300px
• Background = white
• Warna text = grey
• Ukuran Huruf = 12

Bila anda ingin merubahnya, ikuti langkah-langkah dibawah ini :
1.Mengubah ukuran widget (width & height) dan warna background
var so = new SWFObject ("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");

Merah untuk lebar, biru tinggi dan hijau warna background, Kamu bisa mengganti angka tersebut dengan ukuran yang sesuai dengan blog kamu.

2. Mengubah warna huruf
so.addVariable("tcolor", "0x333333";);

3. Mengubah ukuran huruf
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>");

Tidak ada komentar:

Posting Komentar