Minggu, 29 Mei 2011

Cara Membuat Tag Cloud

Buat yang udah mahir mungkin ini udah biasa. tapi buat yang pemula ini mungkin rada-rada sulit. nah untuk membantu para blogger newbie saya membuat tutorial cara membuat "Tag Cloud Cumulus". Biasanya tag ini letaknya di bagian kiri atau kanan sidebar blog. bentuknya sama dengan label standar yang disediakan oleh Blogger. nah langsung aja ini dia tutorialnya. cekidot..!!!!
Untuk membuat tag cloud berputar, Contohnya bisa dilihat di bawah ini....


Untuk memasang tag cloud ke sidebar blog, lakukan prosedur berikut
1. Login ke dashboard
Pilih Tata Letak - Edit Html

2. Cari kode berikut
Isikan materi postingan anda (<b:section class='sidebar' id='sidebar' preferred='yes'>)

Jika menggunakan template blogger designer coba cari kode seperti di bawah ini :

Isikan materi postingan anda (<b:section-contents id='sidebar-right-1'>)

Setelah kode di atas masukkan kode berikut

Isikan materi postingan anda (<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("http://sites.google.com/site/bloggerustemplatus/code/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>
)

3. Simpan template

Jika sukses, maka akan terlihat hasilnya seperti di link ini. silakan klik disini

Catatan,
Jika di blog tempat memasang tag cloud dan tag daftar/text, biasanya tag cloudnya belum muncul.Jika tag cloudnya belum muncul coba di setting manual widget label yang ada di sidebar blog. Pilih option Cloud


Jika ingin mengubah warnanya kamu bisa coba ganti beberapa variabelnya
tagcloud", "240", "300", "7", "#ffffff" ->
a. 240 adalah lebar widget , 300 tinggi widget (angka 240 dan 300 bisa kamu ganti sesuai lebar widget kamu agar lebih rapi),
b. #ffffff adalah warna background, warna backgroundnya bisa kamu ganti dengan warna lain , bisa dilihat disini daftar warna html
3. so.addVariable("tcolor", "0x333333"); dimana , 0x333333 warna teks hitam. warna teks lain yang bisa kamu gunakan:

0xffffff : warna putih
0xFF0000FFF : warna merah
0x00FF00: Warna Hijau
0x0FFFF0: warna Kuning
0x00FF0000 : warna biru
0xFFF000 : warna biru muda
0xFFFFFFF : Warna Hitam
0x0FF0FF0 : warna pink

0 komentar:

Posting Komentar

LinkWithin

Related Posts Plugin for WordPress, Blogger...