Cara membuat tag cloud. atau biasa disebut label animasi ini sengaja saya
posting,mungkin diantara teman-teman ada yang mau memasang di blog anda.
diamping tag cloud ini mempunyai tampilan yang menarik juga bisa membuat
blog kita sangat interaktif.
Karena tampilan tag cloud ini sangat menarik,yaitu bila mouse kita arahkan
ke area tag cloud ini maka labelnya akan berotasi(red=berputar) seperti orbit.
sehingga efek yang ditimbulkan akan sangat menerik sekali.
Ok,bila anda sudah tidak sabaran untuk membuatnya silahkan ikuti langkah-langkah
berikut ini:
1.Seperti biasa login ke blogger.
2.Klik download full template untuk berjaga-jaga.
3.Setelah itu anda klik layout lalu klik edit HTML.
4.Lalu shobat cari code seperti ini:<b:section class='sidebar' id='sidebar' preferred='yes'>
5.Kalau sudah ketemu copy code berikut tepat dibawah kode tadi.
posting,mungkin diantara teman-teman ada yang mau memasang di blog anda.
diamping tag cloud ini mempunyai tampilan yang menarik juga bisa membuat
blog kita sangat interaktif.
Karena tampilan tag cloud ini sangat menarik,yaitu bila mouse kita arahkan
ke area tag cloud ini maka labelnya akan berotasi(red=berputar) seperti orbit.
sehingga efek yang ditimbulkan akan sangat menerik sekali.
Ok,bila anda sudah tidak sabaran untuk membuatnya silahkan ikuti langkah-langkah
berikut ini:
1.Seperti biasa login ke blogger.
2.Klik download full template untuk berjaga-jaga.
3.Setelah itu anda klik layout lalu klik edit HTML.
4.Lalu shobat cari code seperti ini:<b:section class='sidebar' id='sidebar' preferred='yes'>
5.Kalau sudah ketemu copy code berikut tepat dibawah kode tadi.
<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("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "180", "180", "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>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
<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("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "180", "180", "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>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
Angka 180 menunjukkan lebarnya dari tag itu sedang 180 menunjukkan tingginya
silahkan diganti nilainya sesuai dengan ukuran yang shobat inginkan.tapi kalau bisa
sesuaikan dengan ukuran sidebar dari template anda.
Sedang kode ffffff adalah kode dari warna dari background tag cloud tersebut.
sedang angka 333333 adalah warna dari teksnya, dan 12 adalah ukuran teks.shobat
bisa rubah sesuai dengan yang shobat kehendaki.
6.Bila sudah semua silahkan klik simpan.(Save template)
Dan lihat hasilnya.nah mudahkan? semoga bermanfaat.
Posting Komentar - Back to Content