Mempercantik Penampilan Blog Dengan Flash Label Cloud

Teman-teman blogger mungkin acapkali menemui label / kategori yang bisa bergerak (seperti pada kategori di samping kanan blog ini) yang sudah kerap digunakan para blogger di dalam blog mereka. Nah pada pembahasan kali ini saya ingin menjelaskan bagaimana cara membuat yang disebut dengan flash label cloud tersebut.

Label dengan tipe seperti ini ada 2 macam, yakni yang dapat bergerak dan tidak bergerak. Namun di sini saya akan membahas yang bergerak / animasi dulu (kalo pengen yang tidak bergerak sabar dulu bro..!! Lain kali saya jelaskan..ok??!). Caranya cukup mudah, ikuti saja langkah-langkah di bawah ini.

1. Sign in dulu ke Blogger, pada Dashboard, klik Tata Letak.


2. Setelah itu klik Edit HTML.


3. Jangan lupa beri tanda centang pada Expand Template Widget, kalau perlu backup dulu.


4. Cari kode di bawah ini (paling tidak mirip)

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

5. Kemudian masukkan script di bawah ini tepat di bawah kode 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("http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf", "tagcloud", "240", "300", "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>

6. Klik Simpan Perubahan, selesai.


Sedikit tambahan, Anda juga bisa merubah ukuran tinggi (warna merah) dan lebar (warna biru) yang ada di script di atas sesuai keinginan Anda. Terakhir jika mungkin Anda memiliki uneg-uneg, saran, komentar, keluh kesah, atau yang lainnya silahkan saja dikeluarkan dengan mengisi form komentar di bawah. Terimakasih!

Dapatkan update hacking tutorial, tips dan trik menarik seputar teknologi, download full software, belajar bisnis internet, dan masih banyak lagi langsung ke email Anda sekarang juga!

Related Post