Feb 7, 2012

Membuat Label Menjadi Flash Animasi

Akhirnya banyak yang nanya gimana cara membuat animasi label seperti di widget blog ini. Kalau biasanya seperti ini:
Kucing (12)
Bunga (45)
Buku (8)
Maka dengan fitur widget yang baru ini maka label akan berubah menjadi bentuk flash animasi, seperti punya saya tu! Tahu gak?  


Awalnya aku juga sangat interest saat melihat pertama kali di blogseorang teman, dan setelah browsing akhirnya ketemu juga caranya. Sekarang saatnya berbagi tahu dengan teman-teman di blog ini. Caranya mudah
kok. Langsung ya.

Pertama, pilih Tata Letak > Edit HTML
Kedua, centang Expand Template Widget


Ketiga, cari kode di bawah ini

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

jika tidak ketemu, cari kode di bawah ini

<b:include name='quickedit'/> /b:includable></b:widget>

Keeempat, Kalau sudah ketemu taruh script berikut ini di bawahnya.


<b:widget id='Label99' 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://sites.google.com/site/ruangsc/enes/swfobject.js' type='text/javascript'/>
<div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://twitter.com/dchuex'>@dchuex</a> Distributed by <a href='http://kurniasepta.blogspot.com'>Belajar Ngeblog di Blog</a></div>
<script type='text/javascript'>
var so = new SWFObject("http://sites.google.com/site/ruangsc/enes/tagcloud.swf", "tagcloud", "245", "180", "7", "#333333");
// uncomment next line to enable transparency
//so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0xffffff");
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>

Nah sekarang yang bisa kamu ubah adalah:

#333333 adalah warna background-nya
0xffffff adalah warna textnya

Pengetahuan ini saya peroleh dari mas Kurnia dengan rumahnya dapat kamu jumpai di sini. Ya semoga kamu juga berhasil mempraktekannya.
Comments
0 Comments

No comments:

Post a Comment

Berkicau

Community