New Multi-Level Drop-Down Menu

New Multi-Level Drop-Down Menu


Drop down menu makes the navigation in your blog a lot easier, as you can put a number of links in a single row or column.
See this widget in action: ClubVista Template
Similar Widgets:
1. Multi Level Drop Down Menu - Black
2. Sliding Drop Down Menu

To use this drop down menu on your blog, follow these instructions:

STEP #1:
Log in to Blogger, go to Layout and click on "Edit HTML"

Find (CTRL+F) this code in the template:

</head>
and immediately ABOVE / BEFORE that, paste this code:
<!--MULTI-LEVEL-DD-MENU-STARTS-->
<link rel="stylesheet" href="http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/style.css" type="text/css" />
<script type="text/javascript" src="http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/script.js"></script>
<!--MULTI-LEVEL-DD-MENU-http://bloggerstop.net-->

STEP #2:
Now go to "Layout" -> "Edit HTML" -> "Page Elements" and click on "Add a Gadget" and select it as "HTML/JavaScript" type.

And add this code to it:
<!--MULTI-LEVEL-DD-MENU-STARTS-->
<ul class="menunew" id="menu">
<li><a href="#" class="menulink">Dropdown One</a>
<ul>
<li><a href="#">Navigation Item 1</a></li>
<li>
<a href="#" class="sub">Navigation Item 2</a>
<ul>
<li class="topline"><a href="#">Navigation Item 1</a></li>
<li><a href="#">Navigation Item 2</a></li>
<li><a href="#">Navigation Item 3</a></li>
<li><a href="#">Navigation Item 4</a></li>
<li><a href="#">Navigation Item 5</a></li>
</ul>
</li>
<li>
<a href="#" class="sub">Navigation Item 3</a>
<ul>
<li class="topline"><a href="#">Navigation Item 1</a></li>
<li><a href="#">Navigation Item 2</a></li>
<li>
<a href="#" class="sub">Navigation Item 3</a>
<ul>
<li class="topline"><a href="#">Navigation Item 1</a></li>
<li><a href="#">Navigation Item 2</a></li>
<li><a href="#">Navigation Item 3</a></li>
<li><a href="#">Navigation Item 4</a></li>
<li><a href="#">Navigation Item 5</a></li>
<li><a href="#">Navigation Item 6</a></li>
</ul>
</li>
<li><a href="#">Navigation Item 4</a></li>
</ul>
</li>
<li><a href="#">Navigation Item 4</a></li>
<li><a href="#">Navigation Item 5</a></li>
</ul>
</li>
<li><a href="http://bloggerstop.net" class="menulink">Blogger Help</a></li>
<li>
<a href="#" class="menulink">Dropdown Two</a>
<ul>
<li><a href="#">Navigation Item 1</a></li>
<li>
<a href="#" class="sub">Navigation Item 2</a>
<ul>
<li class="topline"><a href="#">Navigation Item 1</a></li>
<li><a href="#">Navigation Item 2</a></li>
<li><a href="#">Navigation Item 3</a></li>
</ul>
</li>
</ul>
</li>
<li>
<a href="#" class="menulink">Dropdown Three</a>
<ul>
<li><a href="#">Navigation Item 1</a></li>
<li><a href="#">Navigation Item 2</a></li>
<li><a href="#">Navigation Item 3</a></li>
<li><a href="#">Navigation Item 4</a></li>
<li><a href="#">Navigation Item 5</a></li>
<li>
<a href="#" class="sub">Navigation Item 6</a>
<ul>
<li class="topline"><a href="#">Navigation Item 1</a></li>
<li><a href="#">Navigation Item 2</a></li>
</ul>
</li>
<li><a href="#">Navigation Item 7</a></li>
<li><a href="#">Navigation Item 8</a></li>
<li><a href="#">Navigation Item 9</a></li>
<li><a href="#">Navigation Item 10</a></li>
</ul>
</li>
</ul>
<script type="text/javascript">
var menu=new menu.dd("menu");
menu.init("menu","menuhover");
</script>
<!--MULTI-LEVEL-DD-MENU-http://bloggerstop.net-->
Of course you have to edit the content before saving this widget.

NOTE: Although the required css and js files are already uploaded and linked in the code in STEP #1, but I suggest you to download and save these files as a backup on your PC:

BackUp - STEP #1:
Download these 2 files:
DDM1_script.js, and
DDM1_style.css

Download zipped file

BackUp - STEP #2:
Upload them to MyDataNest.com, and get the DIRECT LINKS to these files.

Komentar

Posting Komentar

Postingan populer dari blog ini

13 Gerakan Penghilang Stress dan Ngantuk

Gambar
13 Gerakan Penghilang Stress dan Ngantuk  Jam-jam setelah makan siang paling rawan menurunkan produktivitas seseorang. Mengantuk jadi satu alasan utama. Tekanan pekerjaan sejak pagi dan sepanjang hari juga bisa menyebabkan kejenuhan dan stress melanda. Tak usah kuatir, luangkan sedikit waktu untuk 13 gerakan di bawah ini, dijamin bisa segar kembali. Tapi jangan terlalu serius, semua gerakan ini hanya lelucon ala kaskuser. Kalau mau dipraktekan silahkan saja, walau kami tidak menjamin apa yang terjadi. Syukur-syukur semua teman mengikuti gerakan kamu, kalau tidak yah paling banter dicap 'orang gila' hehehe... Langkah 1 Seperti gerakan taichi, lakukan sebagai langkah awal pemanasan. Langkah 2 Lakukan gerakan ini untuk melemaskan bahu dan leher Langkah 3 Buat gerakan memutar dengan tangan Langkah 4 Goyangkan badan ke kanan kemudian ke kiri. Langkah 5 Goyangkan badan ke kiri lalu ke kanan Langkah 6 T...
Baca selengkapnya

Trafis, Hukuman dari guru yang paling kejam sedunia !!

Gambar
Hukuman dari guru yang paling kejam sedunia !!   Setiap anak sekolah, pasti harus menjalankan tugasnya, belajar dan mengerjakan PR. Klo tidak? hmm.. siap2 mendapat hukuman dari bapak/ibu guru. Biar kapok! Klo kmu sendiri, termasuk anak yang rajin ato nakal neh? Jangan2 sering kena hukuman dari guru, gara2 sering ga kerjain PR? Wew, jangan deh.. Ngomongin hukuman gara2 ga kerjain PR, mungkin kamu pernah ngalaminnya. Mungkin pernah di jewer, di cubit ato mungkin disuruh berdiri di depan kelas? Nah, klo yang satu ini, dijamin serem deh hukumannya. Kamu pasti belum pernah dapet hukuman aneh seperti ini. Mau tau?   sumber | iniunic.blogspot.com | http://www.kaskus.co.id/thread/000000000000000013170995/hukuman-dari-guru-yang-paling-kejam-sedunia/ sumber : http://iniunic.blogspot.com/2012/12/hukuman-dari-guru-yang-paling-kejam.html#ixzz2GhjIcmNC
Baca selengkapnya

Cara Menggabungkan Komentar Facebook Dengan Komentar Blogger

Gambar
Cara Menggabungkan Komentar Facebook Dengan Komentar Blogger Cara Menggabungkan Komentar Facebook Dengan Komentar Blogger . Waah.. ada yang baru nih sobat :D  kali ini saya mau share mengenai Cara Menggabungkan Komentar Facebook Dengan Komentar Blogger seperti yang ada di blog saya ini hehe..  kamu bisa lihat contoh komentarnya pada gambar di bawah.. Gimana ? Bagus kan, selain menarik.. komentar yang saya pakai ini kelihatan lebih rapih, dan teratur.. jadi yang gak punya blog pun masih teteup bisa berkomentar, cukup punya facebook aja hehe.. kalo yang pake akun google juga bisa lewat komentar bloggernya.. hehe.. Okelah, Kalau anda tertarik ingin membuatnya, silakan ikuti langkah muda Cara Menggabungkan Komentar Facebook Dengan Komentar Blogger dibawah ini: pilih Rancangan, Edit html, centang Expand Template Widget, Hmm.. untuk menghindari kegagalan dalam pemasangan, mending kamu backup/download dulu template asli kamu buat jaga-jaga.. :) caranya kl...
Baca selengkapnya