Oke, gausah bertele-tele langsung aja kita praktekkan :)
- Masuk ke Rancangan
- Klik Edit HTML
- Cari baris yang bermuatan seperti ini (atau mirip):
<b:section class='sidebar' id='sidebar' preferred='yes'>
- Langsung saja setelah baris tadi, Paste kode berikut dibawahnya:
<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> </div>
<script type='text/javascript'>
var so = new
SWFObject("http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf",
"tagcloud", "240",
"240", "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><a style='font-size:10px;'
href='http://priyananto87.blogspot.com/2013/03/wp-cumulus-di-blogspot.html'>Pasang
gadget seperti ini di blog anda!</a>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
- Lalu pratinjau template anda
terlebih dahulu, apabila sudah terpasang secara benar, kamu boleh
menyimpan template-nya secara aman! Itu saja ;)
Mengkustomisasi 'Blogumus':
Secara default, blogumus akan terpasang dengan pengaturan sbb:
- Lebar: 240px
- Tinggi: 240px
- Warna Background: Transparan
- Warna Teks adalah abu-abu
- Ukuran teks adalah 12px
Jika kamu ingin widget ini lebih lebar, lebih pendek, dirubah warnanya,
dll, kamu harus mengedit beberapa bagian kodenya. Tinggal rubah saja
pada bagian kode berikut:
var so = new SWFObject("http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf", "tagcloud", "240", "240", "7", "#ffffff");
- Tanda Merah untuk merubah lebarnya (dalam satuan px, pixel).
- Tanda Biru untuk merubah tingginya (dalam satuan px, pixel).
- Tanda Hijau untuk merubah warna backgroundnya (isi dengan kode warna hex).
Perhatian! Karena secara default widget ini akan memiliki background yang transparan, merubah warna background tidak akan berpengaruh.
Apabila kamu menginginkan widget ini memiliki warna background yang solid, cari baris kode berikut:
so.addParam("wmode", "transparent");
Tambahkan 2 buah garis miring pada awal baris (//) sehingga terlihat seperti ini:
//so.addParam("wmode", "transparent");
Dengan
seperti itu, kamu bisa memberikan warna background yang solid pada
widget ini. Lalu bagaimana dengan ukuran teks dan warna teks? Untuk
ukuran teks, temukan kode berikut ini:
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>");
Ganti angka warna merah tersebut sesuai ukuran yang dikehendaki. Dan untuk warna teks, temukan kode berikut ini:
so.addVariable("tcolor", "0x333333");
Apabila
kamu sudah menguasai kode warna hex, kamu pasti akan tahu bahwa setiap
kode warna pasti diawali oleh tanda pagar, seperti ini: #333333. Namun
dalam kasus ini, tanda pagar ini dihilangkan dan dimasukkan kedalam kode
yang diberi warna merah seperti diatas.