Wednesday, February 29, 2012

Dropdown Menu

Dropdown Menu? Apa ya artinya? Ini yang namanya Dropdown Menu:



Sekarang udah tau kan? Dengan Dropdown Menu, kita bisa menghemat ruang di blog kita karena ukurannya yang kecil bisa menyimpan link dan teks yang banyak. Bisa diisi dengan arsip, blogroll, dll. Mau tau gimana caranya?


Berikut Cara Membuat Dropdown Menu


1. Login ke akun
Blogger anda.

2. Pilih
Layout > Page Elements > Add Page Elements > HTML/JavaScript

3. Masukkan script berikut ke kotak Content:






<select onChange="document.location.href=this.options[this.selectedIndex].value;">
<option value="0" selected>Arsip Blog</option>
<option value="Links 1">Text 1</option>
<option value="Links 2">Text 2</option>
</select>


Text yang berwarna merah adalah link. Ganti text tersebut dengan link anda.
Text yang berwarna
kuning adalah tulisan yang ditampilkan. Itu juga harus anda ganti.
Contoh:

<select onchange="document.location.href=this.options[this.selectedIndex].value;"> <option selected="selected" value="0">Arsip Blog</option> <option value="http://sahabat18.blogspot.com/search/label/FILM">FILM</option> <option value="http://sahabat18.blogspot.com/search/label/GAME">GAME</option>  <option value="http://sahabat18.blogspot.com/search/label/LAGU%20SUPORTER%20BOLA">SUPORTER BOLA</option> </select>


Hasilnya:


Untuk menambah menu, tambahkan kode <option value="Links 2">Text 2</option> sebelum kode </select>

Link dalam dropdown menu di atas jika di klik akan membuka link di
halaman yang sama. Ini cocok untuk Arsip dan link-link yang masih berhubungan dengan blog tersebut.

Ada satu tipe lagi yang jika diklik linknya maka akan
membuka window baru tanpa menutup blog kamu. Yang ini cocok untu Blogroll atau Friend link.
Cara mambuatnya seperti diatas tapi ganti kode:
<select onChange="document.location.href=this.options[this.selectedIndex].value;">

Dengan kode:

<select onchange="javascript:window.open(this.options[this.selectedIndex].value);">


Gimana?

No comments: