Cara Membuat Dropdown Menu
Apa sih dropdown menu itu?
Dropdown menu yang seperti ini itu lho :
Nha udah tahu kan? Dengan dropdown menu kita bisa mnghemat space/ruang di blog kita, karena dengan ukuran yang kecil seperti itu bisa menyimpan link dan text yang banyak. Itu bisa diisi dengan arsip, blogroll dll.
Gimana? Mau mencobanya?
Gini nih caranya :
Login ke blogger, trus masuk ke menu "Page Element" trus pilih Add page elements --> HTML/JavaScript. Kemudian masukkan script berikut ini di kocat "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 text2 tersebut dengan link2 kamu.
Text yang berwarna biru adalah tulisan yang ditampilkan. Itu juga harus km ganti.
Contohnya seperti ini :
<select onChange="document.location.href=this.options[this.selectedIndex].value;">
<option value="0" selected>Arsip Blog</option>
<option value="http://trik-tips.blogspot.com/2008/01/membuat-menu-horizontal.html"> Cara Membuat Menu Horizontal </option>
<option value="http://trik-tips.blogspot.com/2007/12/cara-membuat-search-engine.html"> Cara Membuat Search Engine </option>
</select>
maka hasilnya akan seperti ini :
untuk menambahkan menu lagi, tambahkan kode seperti ini :
<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 tsb.
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 berikut
<select onChange="document.location.href=this.options[this.selectedIndex].value;">
ganti dengan kode ini :
<select onchange="javascript:window.open(this.options[this.selectedIndex].value);">
hasilnya akan seperti ini :
Gimana? Bisa nggak?
Dropdown menu yang seperti ini itu lho :
Nha udah tahu kan? Dengan dropdown menu kita bisa mnghemat space/ruang di blog kita, karena dengan ukuran yang kecil seperti itu bisa menyimpan link dan text yang banyak. Itu bisa diisi dengan arsip, blogroll dll.
Gimana? Mau mencobanya?
Gini nih caranya :
Login ke blogger, trus masuk ke menu "Page Element" trus pilih Add page elements --> HTML/JavaScript. Kemudian masukkan script berikut ini di kocat "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 text2 tersebut dengan link2 kamu.
Text yang berwarna biru adalah tulisan yang ditampilkan. Itu juga harus km ganti.
Contohnya seperti ini :
<select onChange="document.location.href=this.options[this.selectedIndex].value;">
<option value="0" selected>Arsip Blog</option>
<option value="http://trik-tips.blogspot.com/2008/01/membuat-menu-horizontal.html"> Cara Membuat Menu Horizontal </option>
<option value="http://trik-tips.blogspot.com/2007/12/cara-membuat-search-engine.html"> Cara Membuat Search Engine </option>
</select>
maka hasilnya akan seperti ini :
untuk menambahkan menu lagi, tambahkan kode seperti ini :
<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 tsb.
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 berikut
<select onChange="document.location.href=this.options[this.selectedIndex].value;">
ganti dengan kode ini :
<select onchange="javascript:window.open(this.options[this.selectedIndex].value);">
hasilnya akan seperti ini :
Gimana? Bisa nggak?
By : Bang Udin
Gunakan ----{ CTRL + F }---- Untuk Mencari Artikel
----------------------------------------------------------------------------------
Postingan Baru :
- Cara membuat link berkedip ketika cursor melintas
- Cara Membuat Effect Snow Atau Tabur Salju Di Blog
- Cara Intalasi Windows Seven ( 7 ) Lengkap
- Code Rahasia Semua Type Handphone Lengkap
- Kode BenQ Siemens
- Kode Akses Nokia dengan berbagai tipe
- Kode Akses Sony Ericsson
- Kode Akses Nokia
- Kode Rahasia LG
- Kode Rahasia Samsung
- Kode Rahasia Umum Phonsel Java Dan Symbian
- Cara Daftar Dan Merubah Domain Blogspot Ke .CO.TV
- Cara Membuat Cursor Bertabur Bintang
- Cara Daftar Blog Ke Google
- Cara Pasang Meta Tag Di Blogger SEO Friendly
- Cara Memasang Share Pack (Share Post To Social Boo...
- Cara memasang sharing is sexy di blogspot
- Cara Membuat Taskbar Ato Toolbar Melayang Di Blog
- Cara Membuat Shoutmix Tersembunyi
- Cara Membuat Link Warna - Warni Pelangi Di Blog
- cara memasang meta tag
- Cara pasang video di blog
- Cara Membuat Link Berkedip Warna Warni
- Tempat Ganti Code Warna
- Cara Menu Tab View di Samping
- Cara Membuat Tulisan / text Berkedip
- Cara Membuat Menu Melayang
- Efek Marquee untuk Banner Berjalan
- Salam Pembuka Sesuai Dengan Settingan Waktu
- Mengganti Icon Blogger
- Cara membuat addres bar berjalan
dipraktekan dlu gan...
BalasHapushehehehe....