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://www.hackblogger.co.cc/-->
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-->
Of course you have to edit the content before saving this widget.
<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://www.hackblogger.co.cc/" 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://www.hackblogger.co.cc/-->
NOTE: Although the required css and js files are already uploaded and linked in the code in ,but I suggest you to download and save these files as a backup on your PC:
Download these 2 files:
DDM1_script.js, and
DDM1_style.css
Download Link
Welcome Message
Blog Consits of a Blogger Hacks and Blogger Templates.Enhace your blog with a excellent blogger templates and very good blogger hacks.
Posted on :
9:16 AM
| By :
sriram
| In :
Blogger Hacks
,
Blogger Widgets
,
Multi-Level Drop-Down Menu
Subscribe to:
Post Comments (Atom)





0