Selasa, 05 Oktober 2010

2 Cara membuat Tag/Labels Cloud (berputar di blogspot)

Mungkin ada diantara Sobat yang ingin menghiasi blog dengan tampilan label/tag yang lebih OK!ketika pointer mouse diarahkan ke tag atau label tersebut,maka seluruh tulisan label akan berputar.seperti contoh berikut:
Yang perlu Sobat lakukan ialah:
1. Login ke dashboard
Pilih Tata Letak -> Edit Html


2. Cari kode berikut

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

Jika Sobat menggunakan template blogger designer coba cari kode seperti di bawah ini :
<b:section-contents id='sidebar-right-1'>



Setelah kode di atas Sobat masukkan kode berikut>>

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


Jika sukses maka label/tag sobat akan berputar.


NB:
Jika di blog Sobat 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 Sobat. Pilih option Cloud..





Jika ingin mengubah warnanya Sobat bisa coba ganti beberapa variabelnya
tagcloud", "240", "300", "7", "#ffffff" ->
a. 240 adalah lebar widget , 300 tinggi widget (angka 240 dan 300 bisa Sobat ganti sesuai lebar widget anda agar lebih rapi),
b. #ffffff adalah warna background, warna backgroundnya bisa Sobat 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 Sobat 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



Klo Sobat bingung.. Comment ya!
Selamat mencoba.. 

2 komentar:

hadissoft mengatakan...

Keren ne...thank u tipz'a

Deradja's Blog mengatakan...

sama2 gan..

Posting Komentar