We have new forums at NiteshKothari.com
TopBottom

Widget Tag Clouds pada Blog #2

Posted by madridista at Senin, 01 Februari 2010
Share this post:
Ma.gnolia DiggIt! Del.icio.us Yahoo Furl Technorati Reddit

Sebelumnya kita membahas Tag Clouds dgn fasilitas Delicious, pada artikel kali ini kita membahas Tag Clouds dengan bentuk animasi sehingga terkesan variatif.
Widget tag cloud ini terkesan lebih elegan karena menyajikan animasi gerak jika cursor diarahkan ke widget tersebut. Selama ini mungkin anda hanya mengenal tag cloud standar dengan kata kunci yang hanya berbeda pada besaran hurufnya saja. Nah, bagi anda yang senang mengutak-atik blog, tutorial yang satu ini patut untuk anda coba. Langkah awal, silahkan anda login dan masuk ke account blogger anda dan arahkan ke layout > edit HTML (jangan lupa untuk untuk download full template anda untuk backup jika sesuatu yang tidak diinginkan terjadi).

Langkah selanjutnya, silahkan cari kode di bawah ini :

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


kalau sudah ketemu, silahkan letakkan kode dibawah ini tepat dibawah kode yang diatas :

<b:widget id='Label88' locked='false' title='Tag Cloud' 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://hermanblogtips.blogspot.com'>Herman Blog</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;200&quot;, &quot;150&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='14'><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>


Selesai, jangan lupa simpan template anda.

Catatan : silahkan atur angka 200 yang menunjukkan lebar dan angka 150 yang menunjukkan tingginya. Ganti nilainya sesuai dengan ukuran sidebar template anda. Sedangkan kode huruf ffffff menunjukkan warna background dan angka 333333 menunjukkan warna teks serta angka 14 menunjukkan ukuran teks. Silahkan diganti sesuka hati sesuai selera anda.

1 komentar:

Posting Komentar