One of the most convenient way to display huge lists of links, like BlogRoll or favorite sites etc. is using a drop down menu. It looks like this:
The tool is very useful for webmasters and bloggers, and equally simple is the coding required to put it on your blog/web site.
Follow these simple steps, to add a Drop-Down menu to your blog:
Log in to Blogger, go to "Layout" section, then click on "Add a Gadget", and select it as "HTML/JavaScript"
Now put this code in to it:
<form><select name="menu" onchange="window.open(this.options[this.selectedIndex].value,'_blank')"Replace the blue and red parts of the code, as per your requirements !
size=1 name=menu>
<option>- Your Title - </option>
<!-- change the links with your own -->
<option value="http://yourlink.com">Title One</option><option value="http://yourlink.com">Title second</option><option value="http://yourlink.com">Title Third</option><option value="http://bloggerstop.net">Blogger Widgets</option></select></form>
39 comments:
Just checking these new smilies....never saw them in any blog ;))
you have a great blog...lots to learn.
:)
Hi there, thanks for the info! I was wondering if you know of a way to have a drop down menu in blogger but with your own images as the button and drop downs, instead of the drop down it's in now.
Thanks for your time.
Soon there will be a post on multi-level step down menu, you can use that one.
thanks very much :D
Thanks dude !
@ Chelsea,
As I promised, here's the post on multi-level drop-down menu:
Multi Level DropDown Menu For Blogger Blogs
yea this is cool stuff 8-}
great! this is what I'm looking for. simple and usefull :) thanks man
Thank you so much for the info!!! I have read all these other Blogs with instructions. I spent hours on getting a drop down menu. None of the others worked.
With your instructions I (not a techie by any means) was able to build a "Drop down Menu" in a few minutes.
I am glad to know that Kirk...thanks for commenting and your feedback !
thanx buddy ;)
http;//Xperiencemedia.blogspot.com
Thanks for the drop down menu code, I have tied several others but had issues with all but yours.
Is there a code that can be added so you would be able to use the Configure interface instead of the HTML?
I couldn't get your point Donald, can you plz rephrase it !
Thanks for the info :D
Thanks for the info! On my blog, when I navigate throughout the choices within my dropdown menu, I'd like it if it opens up the page I selected on the same page. You have it set up to when I select something else, it opens up in a new page.
What part of the cod eneeds to be edited to fix this?
Thanks!
Hello Sanders
In the code above change this line:
onchange="window.open(this.options[this.selectedIndex].value,'_blank')"
to this:
onchange="window.open(this.options[this.selectedIndex].value,'_self')"
Just a quick question... what if I don't want the menu option to go to link?
I just want it to open some information.
For example, if you click 'hi' in the dropdown menu, a piece of text appears saying 'hello'
@PC411
you mean something like a pop-up?
hi, thanks so much for the awesome tips.
You are most welcome Stan !
I need Go button After selecting.. ;;)
please can you help for this?
If there's no relation between the "go" button and the selected drop-down item, then you can simply add a HTML button button after the menu.
I like this single-level drop-down menu (I am only using it as a basic archive for my blog posts, so I don't need more levels), but I would like be able to change the background and text colors to match my blog. Is that possible?
...I was also wondering if it is possible to center it, or somehow change the padding, so that the menu does not appear on the left side of my sidebar.
Hey Caroline,
This widget is a simple html based widget, to add a more customizable widget, use this one:
http://bloggerstop.net/2009/03/simple-drop-down-menu-using-jquery.html
Instructions are really simple, and in case of doubts feel free to comment/mail me.
awesome ;))
thanks for the valuable post !
www.king--singh.blogspot.com ! I got help for it ! i hope , in future more valuable posts will be here for blogger !
Is it possible to change the font and colour within the widget?
For a customized widget, use this widget:
http://bloggerstop.net/2009/03/simple-drop-down-menu-using-jquery.html
I really want to install this but have a feeling it's over my head!
hello. how can i make many of them in a single line? can i align them? thanks. your blog really helps...
thank you very much i was looking for this widget, very cool site
thank you very much for these instructions!
This fabulous widget worked like a charm...so easily applied! Thank you so much, truly appreciate your sharing and God bless!
I want to use it on wordpress. Is it possible? what do i need to change to make it work?
Ok, so I was able to create the drop down menu...but when I click on one of the links it doesn't take me anywhere. So how do I make it so it takes you to a specific page of my blog. Thanks so much for your help!
Instead of "http://yourlink.com" type the url-address of the pages/websites - whatever you want.
i would like to have the background of that drop down menu in some other color like black. for example see this link
http://www.basicslife.in/store-locator.php
in tha above link there s a drop down menu to select cities. it is in a kinnd of black colour...is it posible to change thw white background of dropdown menu?
Allowed HTML tags: <b>, <i> and <a>
Join and share your views with other bloggers at BloggerStop Community
Comment Like This! and Optimize your blog...
SPAMMER OF THE MONTH: www[.]Seeking4Hosting[.]com