Selasa, 27 Mei 2014

Membuat Menu Dropdown

Membuat Menu Dropdown

  1. Pertama, lihat susunan kode dibawah ini. Inilah struktur keseleuruhan kode yang akan kita pakai dalam membuat menu drop down.

  2. KODE HTML
  3. Dari susunan kode diatas, , terakhir Kode HTML.
  4. Sekarang yang kita butuhkan adalah, Kode Css dan HTML nya. Tidak harus buat sendiri. Cukup kunjungi situs dibawah ini.
  5. http://cssmenumaker.com/. Selanjutnya, pilih salah satu menu dropdown yang kamu inginkan.
  6. Setelah memilih, maka akan terbuka halaman baru. Pilih Costumize.
  7. Dan atur nama dan isi dari menu dropdown, gunakan add item untuk menambah menu dan gunakan edit item untuk memasukan url isi dari menu tersebut. Seperti gambar dibawah ini.
  8. cara membuat menu dropdown di blog
  9. Setelah selesai mengatur isi menu dropdown, ambil/copy kode CSS dan HTML nya. Dan pastekan di Notepad susun seperti langkah pertama.

 Memasang Menu di Widget atau Gadget

  1. Setelah selesai menyusun semua kode di Notepad. Sekarang ke bagian Tata Letak di blog. Dan Klik Tambahkan Gadget, dan pilih HTML/JavaScript.
  2. Copy semua kode di Notepad tadi dan Pastekan semua kode ke Gadget HTML/JavaScript. Dan Simpan.
  3. Selanjutnya pindahkan Gadget HTML/JavaScript ke bawah Header. Dan Silakan lihat blog.
  4. Menu Dropdown sudah jadi. Jika menu dropdown nya tidak turun. Itu berarti kita harus mengedit bagian header blog.
  5. Silakan ke Bagian Template, klik edit HTML, dan cari kode kode lengkapnya kira-kira seperti dibawah ini.


  6. Ganti maxwidget='1' menjadi maxwidget='3' dan showaddelement='no' menjadi showaddlement='yes'. Dan Save Template.
  7. Kembali lagi ke pengaturan Tata Letak, pindah-pindahkan Gadget HTML/JavaScript tadi, dibawah header. Dan save.
  8. Setelah itu lihat blog, jika menu masih belum turun, ulangi lagi ke pengaturan Tata Letak, pindahkan lagi kode html ke bawah Header dan Save. Sampai Menu Drop Down berjalan dengan benar.
  9. Selesai, menu dropdown sudah jadi. Untuk cara mengubah warna dari menu dropdown, silakan kunjungi situs ini, http://www.cssportal.com/css3-menu-generator/ , disitu kita bisa belajar, cara mengubah bentuk dan warna menu dropdown, juga kode css dan html dari menu dropdown yang kita gunakan.

Tidak ada komentar:

Posting Komentar