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://tutorialbloggermasnoer.blogspot.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://tutorialbloggermasnoer.blogspot.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.

Related

Cara membuat multi tab

Multi tab ini berisi beberapa konten yang bisa kita isi apa saja seperti video, gambar, slide foto, daftar isi, daftar link, dll. Dengan menggunakan multitab ini, kita dapat menghemat tempat yang ada ...

Cara membuat menu tooltip

Menu yang berbentuk vertikal ini sangat menarik untuk dipasang pada web atau blog kita. Selain berfungsi sebagai daftar isi, tepatnya digunakan untuk daftar link atau kita bisa gunakan menu ini sebaga...

Cara membuat tab menu Accordion

Bentuk tampilan tab menu Accordion ini sangat menarik, sangat bagus bila kita pasang pada web ataupun blog kita. Tab menu accordion ini dilengkapi dengan efek animasi sliding. Yaitu animasi sliding y...

Posting Komentar

  1. Mantaapp Boss,,sangat bermanfaat sekali,,salam kenal saya
    http://iwan-cellacopy.blogspot.com/

    BalasHapus
  2. Ridwan..., terima kasih and salam kenal juga....

    BalasHapus
  3. Suara Info...terima kasih,sukses juga buat anda...

    BalasHapus
  4. info yang bagus... simpel dan sederhana tapi sangat bermanfaat bagi bloger pemula seperti saya.



    salam kenal
    www.adib21.com

    BalasHapus
  5. sorry gan..bloggumulusnya kok gk bs cuman tampil "tutorial blog" mohon petunjuk.trims

    BalasHapus
  6. Mas..tolong kirim ke email sy scriptnya blogumulus. terima kasih banyak sebelumnya../ gilang_cell75@yahoo.com

    BalasHapus
    Balasan
    1. Sobat Gilang..., Script animasi blogumulus Sudah saya update lagi, dan selain itu saya tambahkan script cadangan, apabila script yg pertama tidak bekerja..
      selamat mencoba...dan semoga berhasil

      Hapus
  7. Wooww Baguss Bgt Tutorialnya!!

    Kunjungi Blog Aq Yaa:http://www.seputarinfo-dunia.blogspot.com/

    BalasHapus
  8. wahhh keren nih mas hasil jadinya...makasih ya..hee

    BalasHapus
  9. Mantab gan, senang bs berkunjung kesini, salam kenal, ditunggu kunjungan balik

    BalasHapus

emo-but-icon
:noprob:
:smile:
:shy:
:trope:
:sneered:
:happy:
:escort:
:rapt:
:love:
:heart:
:angry:
:hate:
:sad:
:sigh:
:disappointed:
:cry:
:fear:
:surprise:
:unbelieve:
:shit:
:like:
:dislike:
:clap:
:cuff:
:fist:
:ok:
:file:
:link:
:place:
:contact:

Hot in weekRecentComments

Hot in week

Recent

Slide down random post

Satu lagi pengembangan fitur slide show terbaru dari saya. Fitur ini saya beri nama "Slide down random post", sebab fitur ini saya adopsi dan saya kembangkan dari aplikasi recent post yang tampil seca...

Slice Random Recent Post

Dilihat sekilas memang recent post ini tampak seperti biasa, dan hanya tampil judul artikel saja. Tapi sebenarnya recent post ini memiliki tampilan yang lebih, yaitu effek slice atau sebuah lapisan ya...

Buat Toko Online dengan blogger tidak kalah Profesional

Bersamaan dengan Lounching Perdana Toko Online "Jogja Smart", saya ingin berbagi pengalaman  dan pengetahuan tentang blogger kepada sobat - sobat blogger yang mampir di blog tercinta ini.Kendati ...

Cara mengaktifkan Thread Comments blogger

Melihat penggunaan Thread Comments yang ada pada template bawaan blogger, buat saya sangat disayangkan bila dilewatkan. Sebab Thread Comments ini memiliki fitur yang lebih dibanding form komentar yang...

Cara Pasang Rating Bintang Rich Snippets

Bagi yang belum atau masih kesulitan memasang Rating Bintang dan Rich Snippets, berikut langkah yang paling pas dan mudah untuk memasang Rating Bintang dan Rich Snippets.Sebelum menuju caranya, sebaik...

Comments

Manly tours:

artikel ini beserta kode kodenya untuk di passang di website blogger ya mas keren juga mas saya kepingin tapi saya tidak menggunakan website blogger yang saya gunakan website word press, kalau begitu...

peluang usaha:

wah.. keren nih..tanks gan dah share

muhammad isra:

kalau batas waktu 10, apa tidak terlalu cepat gan....salam sukses selalu...ditunggu kunjungan balik dan kritik sarannya......

item