Blogger Bati-Bati

Blog Untuk Semua Kategori

Cara Mudah Membuat Menu Navigasi Drop Down Responsive di Blog


Cara Mudah Membuat Menu Navigasi Drop Down Responsive di Blog

Apa yang dimaksud dengan Menu Navigasi Drop Down? Menu Navigasi Drop Down adalah Menu Navigasi menurun, Menu Navigasi Drop Down sangat membantu bagi kalian yang ingin memasang kategori/label Blog di bawah header atau bisa juga meletakkan label tertentu seperti Blog saya ini contohnya.

Banyak cara membuat/memasang Menu Navigasi Drop Down di Google, tetapi tidak semuanya work saat di terapkan di Blog, kebanyakan hasilnya GATOT alias gagal total. Parahnya lagi saat sudah menambahkan kode Menu Navigasi Drop Down dan menyimpan Template Blog tiba-tiba Template Blog menjadi error. Alasannya hanya satu karena tidak cocok dengan Template Blog.

Kalau dari pengalaman saya sendiri mencari kode Menu Navigasi Drop Down di mesin pencari mbah Google selalu berujung gatot, kemudian saya berinisiatif sendiri dan mengutak atik Template dari Blog saya yang satunya, kebetulan Blog saya yang satunya Menggunaakan Menu Navigasi Drop Down, jadi saya copy kode Menu Navigasi Drop Down pada Template Blog saya yang satunya tadi, kemudian saya edit dan saya coba pasang di Blog saya yang ini, hasilnya ternyata sukses.

Cara pemasangannya pun tidak ribet seperti tutorial yang ada di mesin pencari. Penasarankan? baiklah langsung saja simak Cara Mudah Memasang Menu Navigasi Drop Down Responsive di Blog dibawah ini:

- Pertama-tama login ke Blogger.com

- Langsung menuju menu Template/Edit HTML

- Cari kode Menu Navigasi Blog kalian, Contoh:



- Ganti dengan kode dibawah ini
<div class='clear'/>
<input type='checkbox'/>
<label>&#8801;<span>Navigasi&#160;Menu</span></label>
<ul>
<li><a href='/'>Home</a></li>
      <li><a href='URL'>ANDROID <font size='1'>&#9660;</font></a>
        <ul class='menus'>
    <li><a href='URL'>GAME</a></li>
    <li><a href='URL'>APLIKASI</a></li>
    <li><a href='URL'>LAUNCHER</a></li>
    <li><a href='URL'>TUTORIAL</a></li>
    <li><a href='URL'>EMULATOR</a></li>
    <li><a href='URL'>CHEAT</a></li>
    <li><a href='URL'>SAVE DATA</a></li>
        </ul>
    </li>
<li><a href='URL'>PC <font size='1'>&#9660;</font></a>
        <ul class='menus'>
    <li><a href='URL'>GAME</a></li>
    <li><a href='URL'>SOFTWARE</a></li>
    <li><a href='URL'>EMULATOR</a></li>
    <li><a href='URL'>TUTORIAL</a></li>
        </ul>
    </li>
    <li><a href='URL'>BLOGGER <font size='1'>&#9660;</font></a>
        <ul class='menus'>
    <li><a href='URL'>TUTORIAL</a></li>
    <li><a href='URL'>JAVASCRIPT</a></li>
    <li><a href='URL'>SUB MENU</a></li>
    <li><a href='URL'>SUB MENU</a></li>
        </ul>
    </li>
   <li><a href='URL'>TIPS DAN TRIK <font size='1'>&#9660;</font></a>
        <ul class='menus'>
    <li><a href='URL'>FACEBOOK</a></li>
    <li><a href='URL'>TWITTER</a></li>
    <li><a href='URL'>INSTAGRAM</a></li>
        </ul>
    </li>
    <li><a href='URL'>NEWS <font size='1'>&#9660;</font></a>
        <ul class='menus'>
    <li><a href='URL'>INFORMASI TERBARU</a></li>
    <li><a href='URL'>JADWAL</a></li>
    <li><a href='URL'>PREDIKSI DAN HASIL</a></li>
        </ul>
    </li>
    <li><a href='URL'>UNCATEGORIZED <font size='1'>&#9660;</font></a>
        <ul class='menus'>
    <li><a href='URL'>GAME JAVA</a></li>
    <li><a href='URL'>GAME SYMBIAN</a></li>
    <li><a href='URL'>DOWNLOAD MP3</a></li>
    <li><a href='URL'>TEMA JAVA</a></li>
    <li><a href='URL'>VIDEO</a></li>
    <li><a href='URL'>FOTO LUCU</a></li>
    <li><a href='URL'>REQUEST</a></li>
        </ul>
    </li>
    <li><a href='URL'>CERPEN</a></li>
   </ul>
</nav>
- Bisa juga kalian edit terlebih dahulu sesuka hati kalian

- Hasilnya



Share this article :
+
Previous
Next Post »
0 Komentar untuk "Cara Mudah Membuat Menu Navigasi Drop Down Responsive di Blog"