Ini nih postingan dari saya. Semoga berguna ya buat para blogger yang pengen ngedesain blognya agar cantik. Saya akan ajarkan cara membuat DropDown Menu. DropDown Menu atau menu dropdown adalah menu yang berisikan link yang bisa digunakan untuk link yang mengarah ke blog kita maupun ke web lain.
bisa kita gunakan untuk tempat friends list atau kumpulan link teman2 kita, ataupun link menuju website/situs yang kita sering kunjungi.
berikut ini cara pembuatannya :
bisa kita gunakan untuk tempat friends list atau kumpulan link teman2 kita, ataupun link menuju website/situs yang kita sering kunjungi.
berikut ini cara pembuatannya :
- Login ke Blogger
- Kemudian klik Tata Letak dan Elemen Halaman
- Ketika sudah berada di Elemen Halaman klik Tambah Gadget
- Lalu pilih HTML/JavaScript
- Langkah selanjutnya masukkan kode DropDown Menu seperti contoh dibawah ini :
<form><select name="menu" onchange= "window.open(this.options[this.selectedIndex].value,'_blank')" size=1 name=menu>
<option>- My Friend's Links -</option>
<option value="http://adesyams.blogspot.com/">Ade'S Tricks</option>
<option value="http://id-fans.blogspot.com/">Irvan'S Diary</option>
<option value="http://ikkefransiska.blogspot.com/">Ikke's Blog</option>
<option value="http://gieciencute.blogspot.com/">Blog Icha</option>
</select></form>Hasilnya akan seperti ini :
Ini adalah kode menu dropdown yang beda dengan yang diatas kode dibawah ini dibagi menjadi 2 :
- kode menu dropdown yang apabila di klik tidak membuka halaman/tab baru ( mengganti halaman tersebut dengan link yang baru di klik )
contoh :
Cara membuatnya hampir sama tinggal masukkan kode berikut dibawah ini ke dalam HTML/JavaScript.
kode untuk pembuatan menu seperti di atas adalah:
<center><select onchange= "document.location.href=this.options[this.selectedIndex].value;">
<option value="0" selected="selected">- My Favorite Links -</option>
<option value="http://www.blogger.com/"> Blogger.com </option>
<option value="http://www.google.com/"> Google.com </option>
<option value="http://www.gmail.com/"> GMail (google mail) </option>
<option value="http://www.yahoo.com/"> Yahoo! </option>
<option value="http://www.mail.yahoo.com/"> Yahoo Mail </option>
<option value="http://www.facebook.com/"> FaceBook.com </option>
<option value="http://www.gudanglagu.com/"> GudangLagu.com </option>
<option value="http://www.4shared.com/network/search.jsp"> 4Shared.com </option></select></center>
- kode menu dropdown yang apabila di klik akan membuka halaman/tab baru
Contoh :
Cara membuatnya hampir sama tinggal masukkan kode berikut dibawah ini ke dalam HTML/JavaScript.
kode untuk pembuatan menu seperti di atas adalah:
<center><select onchange= "javascript:window.open(this.options[this.selectedIndex].value;">
<option value="0" selected="selected">- My Favorite Links -</option>
<option value="http://www.blogger.com/"> Blogger.com </option>
<option value="http://www.google.com/"> Google.com </option>
<option value="http://www.gmail.com/"> GMail (google mail) </option>
<option value="http://www.yahoo.com/"> Yahoo! </option>
<option value="http://www.mail.yahoo.com/"> Yahoo Mail </option>
<option value="http://www.facebook.com/"> FaceBook.com </option>
<option value="http://www.gudanglagu.com/"> GudangLagu.com </option>
<option value="http://www.4shared.com/network/search.jsp"> 4Shared.com </option></select></center>
Gantilah tulisan yang berwarna biru dengan link yang kamu inginkan.
Adapun tulisan yang berwarna merah adalah tulisan/nama dari link yang berwarna biru tersebut.
Ket : Kode <center> dan berakhiran </center> adalah agar dimaksudkan berada di posisi tengah pada menu atau sidebar tempat kita menaruh dropdown menu ini.
dan juga bisa dipakai untuk semua kode html maupun java script.
Adapun tulisan yang berwarna merah adalah tulisan/nama dari link yang berwarna biru tersebut.
Ket : Kode <center> dan berakhiran </center> adalah agar dimaksudkan berada di posisi tengah pada menu atau sidebar tempat kita menaruh dropdown menu ini.
dan juga bisa dipakai untuk semua kode html maupun java script.
Semoga berhasil ya ! hehe…
Anda baru saja membaca artikel yang berkategori Tips dan Trik
dengan judul Membuat menu DropDown bagian 2. Anda bisa bookmark halaman ini dengan URL https://komix88.blogspot.com/2010/02/membuat-menu-dropdown-bagian-2.html. Terima kasih!
Ditulis oleh:
komix88.blogspot.com - Kamis, 11 Februari 2010
Belum ada komentar untuk "Membuat menu DropDown bagian 2"
Posting Komentar