Membuat Label Animasi "blogumulus"

Blogumulus adalah sebuah label tag cloud berbentuk animasi atau label flash. Blogumulus bentuknya lebih unik karena teks label tag cloud ini bisa bergerak memutar seperti globe bila mouse kita arahkan ke area Blogumulus.
Blogumulus  awalnya bernama Tag-Cumulus yang diciptakan oleh Roy Tanck untuk pengguna Wordpress. Dan berkat kreatifitas Amanda Fazani sebagai pengguna  blogger, Tag-Cumulus yang banyak dikenal dengan nama Blogumulus pada waktu yang lalu bisa dipakai di blogger.  Tapi entah kenapa sekarang Javascript yang yang saya post pada artikel ini sudah tidak berfungsi.
Jadi saya harus update ulang artikel ini, agar sobat blogger yang tetap menginginkan animasi ini takkan kecewa. Untuk itu saya ucapkan terima kasih banyak pada sobat Apal dan sobat Amricow, karena komentar mereka saya jadi tahu kalau kode yang saya tampilkan sudah kadaluarsa...sa...sa....

OK....bila sobat tetap menginginkan animasi ini, saya ada solusi lain. Tapi animasi Blogumulus ini tidak menghubungkan dengan label atau tag cloud, melainkan kita memberi tag link secara manual. Walaupun demikian Blogumulus ini tidak kalah menarik dibanding dengan Blogumulus yang sudah kadaluarsa tadi.


LIHAT DEMO


Silahkan anda ikuti langkah - langkah berikut ini bila anda berminat membuat :

1. Login ke blogger dengan ID anda.

2. Klik Rancangan dan pilih Elemen Laman

3. Tambah Gadget

4. Pada jendela baru anda Anda pilih gadget HTML/JavaScript

5. Copy dan paste kode dibawah ini pada gadget tersebut :

<div align="center" style="display:true;background:#ffffff; border: 1px solid rgb(198, 198, 198); padding: 0px;">
<script src="http://sites.google.com/site/ruangsc/enes/swfobject.js" type="text/javascript">
</script>
<br />
<div id="flashcontent">
<a href="http://www.carabuatwebgratis.com/">Cara Buat Web Gratis</a></div>
<script type="text/javascript">
var so = new
SWFObject('http://www.swfcabin.com/swf-files/1275932799.swf', 'tagcloud',
'400', '200', '7', '#000000');
so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0xfbfe01");
so.addVariable("mode", "tags");
so.addVariable("distr", "true");
so.addVariable("tspeed", "150");
so.addVariable("tagcloud", "<tags><a href='ULR' style='15'>JUDUL</a><a href='ULR' style='11'>JUDUL</a><a href='ULR' style='20'>JUDUL</a><a href='ULR' style='25'>JUDUL</a><a href='ULR' style='15'>JUDUL</a><a href='ULR' style='10'>JUDUL</a></tags>");so.addParam("allowScriptAccess", "always");so.write("flashcontent");</script></div>

Catatam :

• Nilai 400 adalah Lebar ruang animasi.
• Nilai 200 adalah Tinggi ruang animasi.
• Lebar div 100% (anda bisa menentukan ukuran sendiri).
• Semakin banyak link yang anda masukkan akan terlihat lebih indah. 
• Atribut style menentukan besar kecilnya teks yg muncul
• Untuk menambah tags / Link, harus rapat tanpa spasi atara link satu dengan yang lain seperti berikut :

<a href='ULR' style='15'>JUDUL</a><a href='ULR' style='15'>JUDUL</a>

6. SIMPAN

 
Ada banyak template yang tidak suport dengan script diatas, seperti Blog ini. Tapi setelah Edit Bin Edit, akhirnya saya mendapatkan solusi.

Anda bisa lihat Animasi  Blogumulus hasil rekayasa ulang saya, yang ada pada sidebar kanan Blog ini.

Jadi intinya script ini harus dipastikan pada deretan kode tertentu harus benar - benar rapat, terutama pada penulisan Link / ULR.

Berikut script sebagai solusi, apabila anda menggunakan script tidak bekerja dengan baik :

<div align="center" style="display:true;background:#ffffff; border: 1px solid rgb(198, 198, 198); padding: 0px;"><script type="text/javascript" src="http://sites.google.com/site/ruangsc/enes/swfobject.js"></script><a href="http://www.carabuatwebgratis.com/">Cara Buat Web Gratis</a><div id="flashcontent"><embed width="400" height="200" flashvars="tcolor=0xfbfe01&amp;mode=tags&amp;distr=true&amp;tspeed=150&amp;tagcloud=&lt;tags&gt;DERETAN ULR ANDA TANPA JARAK SPASI&lt;/tags&gt;" allowscriptaccess="always" wmode="transparent" quality="high" bgcolor="#000000" name="tagcloud" id="tagcloud" src="http://www.swfcabin.com/swf-files/1275932799.swf" type="application/x-shockwave-flash"/></div></div>

Catatan :
Saran saya..., tidak langsung memasukkan Link/ULR satu persatu pada script diatas. Tapi sebaiknya anda buat pada notepad DERETAN ULR TANPA SPASI, dengan catatan format word wrap pada notepad tidak di centang. Untuk memastikan ULR yg anda buat benar - benar utuh.

Setelah jadi, deretan ULR yg anda buat tadi  harus di PARSE. 
Anda bisa gunakan TOOL PARSE HTML gratis DISINI

Oh iya maaf, warna background saya ganti dengan warna Putih, tapi anda bisa menggantinya sesuai selera anda.

Selamat mencoba ya... Semoga berhasil seperti pada Blog ini dan Semoga bermanfaat....
Jangan lupa luangkan waktu untuk beri komentar dengan menggunakan nama anda yang benar ya......agar saya bisa merespon komentar anda dengan baik.

Anda juga bisa berlangganan artikel-artikel terbaru dari saya, silahkan anda gunakan tombol berlangganan artikel yang ada disebelah kanan halaman ini, atau melalui tombol dibawah ini.

Judul: Membuat Label Animasi "blogumulus"; Ditulis oleh Unknown; Rating Blog: 5 dari 5

Dengan memasukan alamat email dibawah ini, berarti anda akan dapat kiriman artikel terbaru dari Blogger Tutorial | SEO | Free Blogger Templates | OOM RIO.com di inbox anda:

Related Posts