Ringkasan bagaimana memasang animasi flash di web

Judul awalnya sih pake English – How to setup Flash animation on your web :D. Artikel ini akan disusun sebagai janji saya lantaran masih banyaknya yang komentar (apa komplain ? ehehhe) pada artikel-artikel yang memuat tips memasang animasi flash di website (dalam kasus ini kebetulan yang pada pake Joomla). Oops, ini bukan tentang Joomla yang ribet kalo dipasangin Flash, tapi kayaknya sih lebih pada artikel saya yang kurang detail? (sorry dorry morry bro,sis 😀 )

OK, tanpa banyak ngetik lagi (kebetulan jari gw dah mulai keriting abis ngitung ribuan lembar duit seratus ribuan mijit mouse dari kemarin. Dan untuk itu (baca:menghemat tenaga) , maka gw akan membagi dalam beberapa sesi beserta sejumlah link referensi dan kreatiflah klik link yang gw kasih ya – kasihan nih PageRank situs gw konsisten abizzz 😛 )- masih di situs ini tenang aja ye.

Metode pemasangan kode animasi flash

Ada banyak cara memasang animasi flash, dan disini akan disajikan 3 (tiga) metode, yaitu:

  1. Flash satay
  2. Unonstructive Javascript
  3. Classic method

kode Flash satay:

<object type=”application/x-shockwave-flash” width=”138″ height=”69″ data=”lokasi_file/flash.swf” >
<param name=”movie” value=”lokasi_file/flash.swf” />
<param name=”quality” value=”high” />
<img src=”/lokasi_untuk_image/alternatifimage.gif” alt=”Flash alternatif image”/>
</object>

kode Unobstructive Javascript

<script type=”text/javascript” src=”/lokasi_file/swfobject.js”>
</script>
<div id=”idflash1″>Flash yang dibuat dengan unobstruktif javascript, harus ada Flash Plugin kalo mau liat tampilannya…</div>
<script type=”text/javascript”>
var soflash1 = new SWFObject(“lokasi_file_flash/fileflash.swf”, “movieflash1”, “635”, “150”, “6”, “#FFFFFF”); soflash1.addParam(“loop”, “true”); soflash1.addParam(“wmode”, “transparent”); soflash1.write(“idflash1”); </script>

kode metode Klasik
<OBJECT classid=”clsid:D27CDB6E-AE6D-11cf-96B8-444553540000″ codebase=”http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0″ WIDTH=”550″ HEIGHT=”400″ id=”myMovieName”>
<PARAM NAME=movie VALUE=”myFlashMovie.swf”>
<PARAM NAME=quality VALUE=high>
<PARAM NAME=bgcolor VALUE=#FFFFFF>
<EMBED href=”/support/flash/ts/documents/myFlashMovie.swf” quality=high bgcolor=#FFFFFF WIDTH=”550″ HEIGHT=”400″ NAME=”myMovieName” ALIGN=”” TYPE=”application/x-shockwave-flash” PLUGINSPAGE=”http://www.macromedia.com/go/getflashplayer”>
</EMBED>
</OBJECT>

Sampai disini dulu..bye …becanda 😛

Memasang animasi flash didalam template:

Dalam pemasangan flash di template ada 2 cara mudah, yaitu:

  • kode ditulis langsung didalam skrip template
  • dipasang sebagai module (biasanya pada model CMS)

 

Penulisan langsung kode animasi flash pada template

Tuliskan kode flash dalam ruang yang sudah disiapkan sebelumnya, misal, untuk dipasang sebagai flash header.

Cara yang paling mudah adalah dengan menggunakan ruang yang awalnya dipakai oleh bagian header template. Kenapa mudah? soalnya menghemat waktu dan pikiran juga biaya (halah :P) untuk menuliskan tag HTML dan pengolahan style dengan CSS.
Kalo cara ini kurang menantang (:P) silaken aje nulis tag HTMLnya sendiri. Terserah deh, cara apa yang mau dipake 🙂

Contoh kasus:

dalam suatu template, pada bagian headernya terdapat skrip HTML sebagai berikut:

<div id=”header”>
</div>
Pada tag id header itulah akan dipasang kode flash. (Sudah jelas kan ya :D)

contoh penerapan:
1. Flash satay
<div id=”header”><object type=”application/x-shockwave-flash” width=”138″ height=”69″ data=”lokasi_file/flash.swf” >
<param name=”movie” value=”lokasi_file/flash.swf” />
<param name=”quality” value=”high” />
<img src=”/lokasi_untuk_image/alternatifimage.gif” alt=”Flash alternatif image”/>
</object>
</div>
detil mengenai metode flash satay ini ada di artikel terkait – diklik dong 😀

2. Unobstructive Javascript
<div id=”header”>
<script type=”text/javascript” src=”/lokasi_file/swfobject.js”>
</script>
<div id=”idflash1″>Flash yang dibuat dengan unobstruktif javascript, harus ada Flash Plugin kalo mau liat tampilannya…</div>
<script type=”text/javascript”>
var soflash1 = new SWFObject(“lokasi_file_flash/fileflash.swf”, “movieflash1”, “635”, “150”, “6”, “#FFFFFF”); soflash1.addParam(“loop”, “true”); soflash1.addParam(“wmode”, “transparent”); soflash1.write(“idflash1”); </script>
</div>
khusus untuk metode ini,diperlukan satu buah file yang isinya kode swfobject. nama filenya bisa diganti-ganti (yang dipake kan isinya :P).
File swfobject ini sebaiknya menggunakan versi terbaru. (pada artikel flash dengan unobstructive javascript sebelumnya ada yang versi lama, masih bisa kok)

3. Metode Klasik
<div id=”header”>
<OBJECT classid=”clsid:D27CDB6E-AE6D-11cf-96B8-444553540000″ codebase=”http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0″ WIDTH=”550″ HEIGHT=”400″ id=”myMovieName”>
<PARAM NAME=movie VALUE=”myFlashMovie.swf”>
<PARAM NAME=quality VALUE=high>
<PARAM NAME=bgcolor VALUE=#FFFFFF>
<EMBED href=”/support/flash/ts/documents/myFlashMovie.swf” quality=high bgcolor=#FFFFFF WIDTH=”550″ HEIGHT=”400″ NAME=”myMovieName” ALIGN=”” TYPE=”application/x-shockwave-flash” PLUGINSPAGE=”http://www.macromedia.com/go/getflashplayer”>
</EMBED>
</OBJECT>
</div>
Kalo begini keliatan kan bedanya.
Dari tata struktur kodenya aja sudah beda. Silakan pilih mana yang disuka.
Dan jangan lupa,
sesuaikan dengan nama lokasi dan nama file yang ada di server masing-masing.Penggunaan warna pada kode tidak ada hubungannya dengan jalur politik :P.
Ini cuma gampangnya aja, Merah Kuning Ijo (soalnya pas nulis ini sambil nyanyi lagu jaman Taman Kanak-Kanak dulu 😛 )

Penulisan kode animasi flash dalam suatu modul

Pada prinsipnya, pengulisan dalam suatu modul ataupun langsung pada skrip template adalah sama.
Pada model penulisan sebagai modul, pengembang dapat lebih leluasa menentukan dihalaman mana saja animasi flash akan ditampilkan. Letaknya pun bisa lebih fleksibel.

Untuk pemasangan animasi flash pada Joomla 1.5, bisa menggunakan modul Custom HTML.
Bagaimana caranya ada di artikel tentang memasang modul dalam artikel.

Sampai disini mudah-mudahan jelas.

Perbedaan penulisan kode animasi flash di template dan sebagai modul

Meski secara prinsip penulisan kode animasi flash adalah sama, terdapat perbedaan, yang bisa diterjemahkan sebagai kelebihan dan kekurangan.

1. Penulisan langsung kode animasi flash

  • kode ditulis langsung pada skrip
  • penyuntingan kode dapat langsung (bypass aja via FTP)
  • flash langsung dipanggil saat halaman di-load oleh server
  • dapat digunakan sebagai halaman pembuka

2. Penulisan kode animasi sebagai modul

  • penyuntingan harus dalam kondisi login di admin panel *
  • flash dapat dimuat di halaman-halaman berbeda (suka-suka hati lah :D)
  • animasi flash bisa jauh lebih variatif

Catatan:
* : bisa di bypass melalui phpMyAdmin juga. Kalo belum biasa sebaiknya jangan 😛

Perbedaan yang ada antara 2 cara penulisan tadi memberikan keuntungan tersendiri (gak ada ruginya 😛 ). Tergantung bagaimana kreatifitas anda dalam menyajikannya. Apapun animasi flash yang ditampilkan, dengan olah logika yang baik dan benar (sotoy deh :D), akan memberi hasil yang optimal, baik secara visual dan kecepatan loading.

Kiranya sekian dulu artikel Ringkasan Pemasangan Animasi Flash ini, gw mau undur diri eh mau nulis yang lain lagi nih.

Kalo ada yang kurang jelas, silakan berikan opini anda pada kotak komentar dibawah.
Ada rencana satu saat nanti kotak komentar mau gw setting untuk DoFollow, atau untuk Pemberi Komentar (bukan spam ye ) terbanyak dikasih backlink DoFollow sebagai apresiasi demi kemajuan bangsa dan negara (halah ngawur deh :P) – maksudnya kemajuan dan kualitas artikel yang gw posting disini.

Akhirul ngetik, selamat Nge-Flash dan kalo sukses dengan percobaannya jangan sungkan-sungkan untuk unjuk pamer ke gw.

PS: postingan ini ditulis dan diterbitkan secara live 😀

(postingan ini belum selesai, nanti disambung lagi. Insya Allah Sabtu/Minggu dah kelar :D. Mo nonton bang James Bond dulu nih…:P )

Comments are closed.