Membuat Menu Dropdown




Menu dropdown dibuat agar dapat menghemat ruang daripada blog kita, apalagi sidebar kita sudah dipenuhi dengan berbagai macam widgets sehingga menjadi sesak.
Mau tahu cara pembuatannya. Ikuti langkah-langkahnya:
  1. Login dulu di Blogger.com / Blogspot.com
  2. Klik menu "Page Element"
  3. Pilih Add Page Elements --> HTML/JavaScript

Kemudian masukkan script berikut ini:

<form>
onChange="document.location.href=this.options[this.selectedIndex].value;">
<option value="0" selected>Artikel</option>
<option value="http://tips-mempercantik-blog.blogspot.com/2009/03/membuat-artikel-yang-berhubungan.html">1. Membuat Artikel Berhubungan</option>
<option value="http://tips-mempercantik-blog.blogspot.com/2009/03/membuat-text-link-berkelap-kelip.html">2. Text Link Kelap Kelip</option>
<!-- Tambahkan Link disini -->
</select>
</form>

Tips Mempercantik Blog, Mar 2009




Maka Hasilnya sebagai berikut:



Jika kita ingin menu dibuka pada jendela baru (new window), langkah-langkahnya sebagai berikut:
<form>
<select name="menu" onchange="window.open(this.options[this.selectedIndex].value,'_blank')"size=1 name=menu>
<option> - Artikel - </option>
<option value="http://tips-mempercantik-blog.blogspot.com/2009/03/membuat-artikel-yang-berhubungan.html">1. Membuat Artikel Berhubungan</option>
<option value="http://tips-mempercantik-blog.blogspot.com/2009/03/membuat-text-link-berkelap-kelip.html">2. Text Link Kelap Kelip</option>
<!-- Tambahkan Link disini -->
</select>
</form>


Hasilnya akan seperti ini:

Related Posts



6 komentar:

  1. ass...

    mas Q minta tolong cara membuat daftar isi yang kaya tips n trick,komentar,english kaya punya akang kaya mana ya???

    kirim di e-mail Q ya kang tolong...
    alfath_ym@yahoo.com

    BalasHapus
  2. Ass..

    Mas lebarnya bisa di sesuain ga sama ukuran kolom blognya??... di jawab ya mas di tunggu

    BalasHapus
  3. @alfath: Kan tutorialnya dah ada, bisa dikembangkan lagi biar kreatif

    @banjaran: script itu bisa menyesuaikan dengan widgets/sidebar (bisa langsung digunakan)

    BalasHapus
  4. gimana yha, cara membuat kolom formulir comment seperti kolom yang saya isi ini?
    mohon jawabannya ke blog saya..
    terima kasih...

    BalasHapus
  5. International Relations
    Mas aq ada sesuatu buat anda.
    visit my blog please.
    I have something for you :)
    Thanks :)

    BalasHapus