TIP HANGAT...awan label ke label awan??

Gambar ni, tiada kaitan dengan artikel aku ni..hehehe

Hari ni aku akan explain cara buat label cloud macam kat tepi kanan blog aku ni..(siap boleh pusing-pusing lagi..hohoho)

Atas permintaan pembaca yang tak memperkenalkan identitinya.. aku cuba explain dengan cara yang paling mudah..

Tapi hati-hati sebab kita akan bermain dengan kod HTML.. Backup dulu template sebelum mencuba!!!

Firstly, log in ke dashboard/papan pemuka > layout > edit html >

cari kod HTML seperti ini (atau seakan-akan):

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

(nak mudah, search kod di atas dengan menggunakan ctrl F)


Dah jumpa?? ok..seterusnya, letakkan kod biru di bawah ini SELEPAS kod di atas..


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


Senang je kan... Dah paste kod di atas ni, boleh la try preview.. Nanti gajet ni akan paparkan label-label yang anda tetapkan untuk setiap post/artikel..

lagi banyak jenis label pada post/artikel anda, lagi la banyak link label yang akan keluar pada gajet label awan ni..

Untuk ubahsuai gajet ni, begini caranya..

(hati-hati sebab salah edit, gajet tak akan berfungsi)

Ini adalah keterangan kod yang anda copy paste tadi..

•Lebar gajet di set kepada 240px
•Tinggi gajet di set kepada 300px;
•Latar belakang ialah putih
•Warna link label ialah kelabu
•Saiz aksara ialah "12"

UBAH SAIZ DAN LATAR BELAKANG

Nak ubah saiz gajet ini supaya sama saiz dengan widget sidebar anda?? begini cari kod seperti di bawah ini dan ubahlah angka yang diwarnakan merah ini..ingat, saiz lebar dan tinggi tadi... Kalau nak tukar warna latar belakang gajet, ubah kod yang warna biru pula ya..(guna kod warna hex sahaja) ..Ini kod yang perlu di ubah..cari la di html blog anda


var so = new SWFObject("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");

UBAH WARNA TEKS LABEL

Kalau nak tukar warna teks label pula, cari kod di bawah ini dan ubah kod yang berwarna biru ni... Ini kod yang perlu diubah..Cari di html blog anda

so.addVariable("tcolor", "0x333333");

UBAH SAIZ AKSARA
Nak ubah saiz aksara??? ok cari kod di bawah ini dan ubah kod yang berwarna biru ni..


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>");

Dah selesai, save dan lihat la blog anda..

(tak semua template sesuai untuk gajet ini)
Ok..itu sahaja.. sebarang masalah atau pendapat, boleh dikongsikan ye..

SELAMAT MENCUBA!!