Add navigation or drop down menu in blogger

Here is an easy tutorial to add Navigation Menu or Drop Down Menu in Blogger. With this navigation Menu widget you can display most important links or categories in drop Down Menu format. This navigation Menu is very tiny and you can display as many links you want.

Let us see how to add this Navigation menu widget in Blogger :

Here is the Default code of Navigation menu :

<form><select name="menu" onchange="window.open(this.options[this.selectedIndex].value,'_blank')"size=1 name=menu>

<option value=0 selected> Type your Navigation Menu Title Here! </option>
<option value=" Url of your Link here "> Title of your link </option> </select></form>

in this above code , you need to edit the text in red to add links .

The text in green color is meant to open links in new window. If you want the links to be opened in same window then replace the text in green to this blank . ( that is delete _ )

if you want to add more links then add the last three lines in violet repeatedly as many times you want.

Look At My code below so that you can get an idea :

<form><select name="menu" onchange="window.open(this.options[this.selectedIndex].value,'_blank')"size=1 name=menu>

<option>- Blogger Accessories- </option>

<!-- change the links with your own -->

<option value="http://bloggeracs.blogspot.com/2008/07/jumong-three-column-blogger-template.html">Jumong Blogger Template</option>

<option value="http://bloggeracs.blogspot.com/2008/07/show-date-before-each-post-in-blogger.html">Show Date before each post</option>

<option value="http://bloggeracs.blogspot.com/2008/07/related-posts-widget-for-blogger.html">Related Posts Widget</option>

<option value="http://bloggeracs.blogspot.com/2008/07/hide-navigation-bar-in-blogger.html">Hide Navigation menu bar in blogger</option>

</select></form>

the result is :

- Blogger Accessories- Jumong Blogger TemplateShow Date before each postRelated Posts WidgetHide Navigation menu bar in blogger

How to Add this Navigation menu / Drop down Menu To my blog ?

It's very simple . First edit the code according to your wish and copy the code .

* Go to Layout section of your template .

* Click Add PageElement tab in sidebar

* Select HTML/JAVASCRIPT subtab

* Paste the Navigation Menu code you copied before there and save .

that's it now you can see a beautiful Navigation Menu in your blog.

See you soon with a new hack .