Saturday, November 27, 2010

Tutorial Membuat Menu Navigasi Dropdown Horizontal/Vertikal Pada Blog Dan Website Dengan Efek Flash

Judul yang terlalu panjang, hehehe..Pernah lihat menu sentraBLOG sebelumnya, pada menu navigasi tersebut saya menggunakan konten flash tetapi sekarang saya sudah menggunakan navigasi menu dengan CSS karena alasan tertentu (bisa dilihat sendiri diatas). Lalu apa perbedaan dan keuntungan antara menu FLASH dengan CSS nah akan saya jelaskan pada akhir tulisan ini. Disini saya hanya akan menjelaskan bagaimana membuat menu navigasi Flash pada blog secara instant, langsung saja.

Untuk membuat menu (konten flash) maka tidak terlepas dari software adobe flash (bukan flash playernya), tetapi untuk mempelajari dan membuatnya menggunakan adobe flash cukup rumit sekali, nah sesuai dengan janji saya tadi kita akan membuat menu tersebut dengan cara yang instant maka disini saya menggunakan software Flash Menu Factory. Sudah pada tau software ini belum,,hehehe... Langsung Tutorial aja yah, males panjang lebar.

1. Sudah pasti harus download dulu software Flash Menu Factory nya, silahkan download disini.
2. So pasti setelah download harus diinstal, lanjut.
3. Setelah diinstal maka tampilan awalnya adalah seperti ini



4. Kemudian buat file baru ( File – New ), selanjutnya pilih mode menu yang anda inginkan pada kolom Skin Browser anda bisa memilih horizontal atau vertical.

5. Setelah itu lanjut ke kolom Menu Structure, disini kita akan membuat item – item menu kita, disini saya mengisikan dengan home, news, komputer, dll. Serta isikan juga isi – isi tiap menu nya contohnya pada menu komputer saya menuliskan dengan berita online hari ini, tv online dan serba-serbi sentraBLOG (bisa lihat demo menu saya).



6. Setelah membuat menu structurenya langkah selanjutnya adalah memasukkan link pada setiap menu agar jika di klik langsung menuju ke halaman yang kita inginkan. Caranya klik pada menu yang anda buat tadi kemudian masukkan linknya pada kolom Menu Item Properties, berikut penjelasannya :



Baris Text : merupakan nama item menu anda
Link : adalah link tujuan dari menu item tersebut
Icon : ikon menu item anda (optional)
Target : - new window (_blank) : jika menu diklik akan membuka pada jendela baru (open new tab)
             - _self : jika diklik akan terbuka pada jendela yang sama
             - parent, top : sama saja seperti _self

Contoh : disini saya memasukkan link http://sentrablog.blogspot.com/2010/02/berita-nasional-olahraga-sepak-bola-hot.html pada menu tv online tanpa ikon dan targetnya adalah _self

7. Maka menu anda sudah jadi dan siap dipasang pada blog anda, tapi itu hanya standart alias biasa saja. Selanjutnya kreasikan menu anda pada kolom seperti gambar berikut :


    Kolom Selection Animation : disini anda bisa memilih animasi menu yang anda inginkan
    Mouse over sound : memberikan efek suara jika menu diklik
    Bg Color : sesuaikan dengan background page blog anda (disini saya menggunakan putih)
    Width, Height : atur panjang dan lebar menu
    Menu Transparency : saya sarankan 0%
    Add Preloader : memberikan tampilan loading (sampai 100%) ketika blog/web anda dibuka.
    Sisanya atur sendiri,,hehehe….

8. Setelah itu save. Maka file yang dihasilkan adalah .fmf, selajutnya kita ubah kedalam .swf agar file tersebut bisa dibuka pada browser. Caranya Klik File – Export (save) Flash Menu lalu save. Coba anda buka file .swf tadi menggunakan browser anda (disini saya menggunakan mozila), jangan lupa diklik menu nya, dan seperti apa hasilnya???

Menu dropdown anda sudah jadi, sekarang saatnya bagaimana mempublishnya kedalam template blog/website anda. Berhubung tulisan ini sudah panjang sekali dan saya yakin anda sudah bosan membacanya,, hehehe,, tulisan selanjutnya saya postingkan pada halaman yang berbeda biar tidak bosan membacanya. Silahkan dibaca disini.


Download Flash Menu Factory Full Version disini

Demo Menu Kreasi Saya ( sama seperti menu pada blog saya dulu )

0 comments:

X-BOX BLOGGER TEMPLATE | x-template