Tutorial Membuat Flash Label Cloud

Beberapa hari yang lalu, ada yang menanyakan di shoutbox (maaf namanya siapa lupa, belum sempet liat lagi, hehe :p) mengenai cara membuat flash label cloud seperti yang ada di blog saya ini. Karena gak ingin mengecewakan pembaca, tentunya saya akan buat tutorial cara membuatnya disini. 1 hal yang perlu diingat, bukan saya yang nemuin cara buat flash label cloud, tapi saya cuma ikutin tutorial dari para blog master yang lain, heuhue.. :)

Nah caranya kurang lebih seperti berikut ini :

0. Save template dulu sebagai persiapan awal.
1. Seperti biasa kita masuk di bagian "Edit HTML" di blog kita
2. Cari kode yang kurang lebih sama / mirip dengan kode ini :

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

3. Lalu tambahkan kode berikut di bawah kode yang di atas tadi :

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

4. Save dan bisa lihat hasilnya. Secara otomatis akan muncul Elemen Halaman baru di halaman Elemen Halaman kita.
5. Jika kurang cocok dengan ukuran font, lebar kotak, dan tinggi kotak labelnya, edit di bagian yang tulisan 240px (lebar), 300px (tinggi), "12" (ukuran font).

Selamat Mencoba..

Related Posts by Categories