Panduan Praktis Cara membuat Label Animasi Tag Cloud Cumulus Suka-Suka

Tak dapat di pungkiri bahwa Label Animasi Tag Cloud Cumulus merupakan satu widget label tercantik yang hingga detik ini belum tersaingi oleh widget label manapun. Animasi yang tercipta melalui file berekstensi .swf ini mampu memberi nuansa keindahan sebuah animasi dan tidak mengurangi sedikitpun fungsi utamanya sebagai sebuah label yang mampu melengkapi kebutuhan sebuah blog.

Meskipun dibeberapa waktu belakangan ini Label Cloud Cumulus mengalami beberapa kendala penggunaan berkaitan dengan matinya sumber pengaktifan tag cloud oleh sebuah situs (dihanguskanya javascript dan file swf oleh halotemplates.s3.amazonaws.com?), namun kini sampeyan tidak perlu khawatir lagi karena kita bisa membuat tag cloud animasi cumulus ini secara mandiri dengan cara mengupload file flash cumulus dan javascript-nya di free swf dan javascript hosting.
.

Mengapa kita perlu untuk membuat tagcloud cumulus yang mandiri :

Penggunaan tagcloud cumulus tidak berbeda dengan yang terjadi pada Side Menu(yang akan kita bongkar lagi di posting selanjutnya), yang akhirnya mulai menghilang juga dari peredaran. Pengalaman seperti ini bisa kita gunakan sebagai pemicu semangat untuk selalu berusaha mandiri dan tidak menggantungkan diri pada 1 (satu) situs saja. Kemandirian ini tentunya tidak dalam arti sepenuhnya semua kita lakukan sendiri dengan semua fasilitas, sarana dan prasarana sendiri, melainkan setidak-tidaknya jika kita mempunyai file pribadi maka kemungkina-kemungkina buruk lebih bisa di tekan. Meskipun demikian, apabila sampeyan nantinya tetap menggunakan URL javascript dan swf yang saya sertakan juga tidak menjadi masalah. Apa yang saya sampaikan di atas hanyalah sekedar saran saja demi kelancaran tag cloud cumulus yang akan di buat. Pembuatan Tag cloud cumulus ini akan kita buat dalam beberapa serial posting karena berbagai pengembangan yang dilakukan terhadap tagcloud ini mampu menghadirkan berbagai wajah yang berbeda.

Cara Paling Praktis Membuat Label Tag Cloud Animasi Cumulus Suka-Suka:

1. Login to BloGGeR : Tuliskan "User Name/Alamat Email" dan Masukkan "Password/Sandi".
2. Dasboard/Dasbor : Halaman Dasbor adalah halaman yang terbuka setelah login dilakukan. KLIK link "Layout/Tata Letak".
3. Layout/Tata Letak : Setelah loading beberapa saat kita akan melihat sebuah halaman baru : "Layout-Page Element" atau "Tata Letak-Elemen Laman", yang di dalamnya terdapat blok-blok (kotak2/kolom2) dengan posisi di atas, kanan atau kiri dan tengah serta bawah. KLIK pada bagian bergaris putus-putus di samping kanan atau kiri yang bertuliskan "Add Widget/Tambah Gadget".
4. Add Gadget/Tambahkan Gadget : Ada banyak wadget yang mungkin ditambahkan melalui window ini, di depan sampeyan tampak kolom penambahan widget "HTML/Javascript". KLIK di bagian gambar/image atau teks yang bertuliskan HTML/Javascript".
5. Copy-Paste : Copy javascript dan pastekan pada box yang telah tersedia. Silahkan tulis judul/nama untuk label tersebut pada kolom bagian atas, jika sampeyan menginginkan.
6. Copy-Paste : Copy javascript dan pastekan pada box yang telah tersedia. Silahkan tulis judul/nama untuk label tersebut pada kolom bagian atas, jika sampeyan menginginkan.
7. Lihat Blog : Buka Blog untuk melihat hasilnya!.

Javascript Label Tag Cloud Animasi Cumulus Suka-Suka

<div align="center" style="padding:4px;border:5px solid #555;">
<script src='http://tagcloud-cumulus.googlecode.com/files/bgsGR_cumulus.js' type='text/javascript'></script>
<div id='flashcontent'>gubhug-reyot</div>
<script type='text/javascript'>
var so = new 
SWFObject('http://www.swfcabin.com/swf-files/1275932799.swf', 'tagcloud', '180', '220', '7', '#343664');
/*  bgsGR -gubhug reyot */
// so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0xfbfe01");
so.addVariable("mode", "tags");
so.addVariable("distr", "true");
so.addVariable("tspeed", "160");
so.addVariable("tagcloud", "<tags><a target='_blank' href='http://gubhugreyot.blogdetik.com' style='14'>gubhugreyot blogdetik</a><a href='http://gubhugreyot.blogspot.com/search/label/Adobe%20Photoshop' style='14'>Adobe Photoshop</a><a href='http://gubhugreyot.blogspot.com/search/label/Animasi' style='12'>Animasi</a><a href='http://gubhugreyot.blogspot.com/search/label/Blink%20Effects' style='14'>Blink Effects</a><a href='http://gubhugreyot.blogspot.com/search/label/Blog%20Design' style='18'>Blog Design</a><a href='http://gubhugreyot.blogspot.com/search/label/Cursor' style='14'>Cursor</a><a href='http://gubhugreyot.blogspot.com/search/label/read%20more' style='16'>read more</a><a href='http://gubhugreyot.blogspot.com/search/label/Tagcloud' style='14'>Tagcloud</a></tags>");
so.addParam("allowScriptAccess", "always");
so.write("flashcontent");
</script>
</div>

Keterangan - Catatan :

• Tag Cloud Suka-suka : Mengapa tag cloud ini berlabel seperti itu? Hanya masalah sederhana sebenarnya. Dengan menggunakan model yang seperti ini, maka kita bebas mau memasukkan URL apapun. Mau URL blog sampeyan yang lain bisa, mau URL posting bisa, mau URL label pun bisa juga. Bahkan kalau rumah mertua sampeyan punya URL, masukkan sekalian juga boleh, he .... he ....
• Coba Dulu Baru Perbagian di Rubah : Langkah yang terbaik adalah sampeyan coba dulu, setelah berhasil ditampilkan, coba lakukan perubahan yang diperlukan.
• Ganti URL dan Title : Ganti seluruh URL berikut titlenya dengan milik sampeyan sendiri. (Jangan sekali-kali milik tetangga sebealah yang sampeyan ambil. Bisa celaka kalau suaminya bawa pedang ! He ....).
• Padatkan Link : Padat sama artinya dengan merapatkan setiap link yang digunakan di tag cloud.
  Contoh :

  <tags><a href='http://gubhugreyot.blogspot.com/search/label/Adobe%20Photoshop' style='14'>Adobe Photoshop</a><a href='http://gubhugreyot.blogspot.com/search/label/Animasi' style='12'>Animasi</tags>

  Jadi dimulai dari tag pembuka :
  <tags><a href="...." style=".."> .... </a> ...... dst hingga </tags>");
  kode/javascript di atas tidak boleh terputus sama sekali.
• Transparant :Untuk membuat background transparan pada tagcloud, hilangkan tanda
  "//" di depan kode : so.addParam("wmode", "transparent");
• Upload : Untuk jaga-jaga atau membuat tag cloud mandiri sebisa mungkin lakukan upload terhadap javascript dan file flash-nya (secara pribadi tak akan pernah sekalipun saya menghapus file tersebut!).
• Speed/Kecepatan : Kecepatan animasi gerak akan bertambah bilai nilainya diperbesar. Demikian pula sebaliknya akan semakin lambat bila diperkecil.
• Double Simpan/SAVE : Pada saat melakukan perubahan apapun (setelah di coba), sampeyan terakhir kali pasti akan menutup perubahan dengan KLIK "Simpan. Jangan lupa untuk sekali lagi KLIK "Simpan, yang terletak di bagian kanan atas halaman "Elemen Laman", baru buka blog untuk melihat hasilnya.

Penting diperhatikan

1. Silahkan coba seluruh kode tanpa melakukan perubahan apapun.
2. Setelah percobaan berhasil dengan baik silahkan untuk mengganti beberapa kode untuk penyesuaian dengan kebutuhan yang ingin di tampilkan.
3. Akan lebih baik jika javascript dan file flash-nya diupload sendiri di file hosting agar tagcloud dapat selalu terloading dengan baik karena apabila javascript dan file flash ini nantinya digunakan banyak blogger maka bandwidth akan tersita habis!
4. Panduan upload javascript (http://tagcloud-cumulus.googlecode.com/files/bgsGR_cumulus.js) dan file flash/.swf (http://www.swfcabin.com/swf-files/1275932799.swf) dapat sampeyan buka melalui link berikut:
   Panduan Upload dan simpan file di Google Sites
5. Khusus upload javascript, selain di Google Sites, sampeyan bisa upload di yourjavascript.com. Buka link berikut untuk mengikuti panduannya:
   Panduan Upload dan simpan javascript di yourjavascript.com
6. Panduan berikutnya untuk upload file .swf di swfCabin dan cara mendapatkan linknya :
   Panduan Upload dan cara mendapatkan link file .swf di swfCabin

180	lebar (width) tagcloud
220	tinggi (height) tag cloud
#343664	warna background
fbfe01	warna teks link
300	kecepatan gerak animasi tag cloud
16	ukuran font

Silahkan juga buka Tutorial lain yang sangat menarik dan patut di ikuti sampeyan semua. Akses melalui link di bawah ini :

» Happy Blogging - gubhugreyot «