November 27, 2006

Create drop-down menus easily

Blogger Beta provides an easy way to create link lists even for those who don't know HTML. But, there is no such functionality for drop-down menus. I had a few people ask me how to create drop-down menus and where to add them in the template. I thought this is something which can be simplified using a third-party widget. I have created an interface, similar to that of Beta, with which you can easily create drop-down menus and add them to your blog with one-click!

Just goto my Drop-down menu creator page and add your menu items one by one by providing a name and URL for each item. The updated menu will be shown to you. Once you are happy with the menu that you created, click the button to add it to your blog. You will see a page (like the one shown below) where you can select the blog (if you have more than one), provide a title for your menu and then click "Add Widget". You will see the widget getting added to your sidebar which you can move around to wherever you want. All this can be done without touching the template code!



46 comments:

Shelly said...

Way cool. I can't wait to try it. Thanks.

Jason Leslie Rogers said...

Thanks for this one, I can't wait to try it!

True Life said...

simple but neat

Ricardo Santos said...

Thanks Ramani!

Its very easy to leave a blog with that kind of dropdowm menu, specially if the mouse has a wheel, cant you add a go/visit button after the link has been selected? only after clicking on the button the visitor gets redirected.

Ramani said...

Ricardo, that sounds like the right way. I will change it soon.

phydeaux3 said...

Very slick. Another nice one.

REGENCY EMAILER said...

Great job and many thanks for the drop down menu. The only problem is that I can't put any posts under the drop down window (similar to the drop down window that deals with archives. How do you post?

delang said...

thanks alot ramani.
but how about sort base on frequently or alphabet option

Ramani said...

Regency, do you want to display the recent posts as a dropdown menu?

Delang, Yes that is a possible improvement. will consider it.

euphrony said...

Any suggestions on how to make the selected link in a drop-down menu pop up in a new window?

Ramani said...

Euphrony, I can probably add an option for that.

troubled said...

do you know how to make drop-down archive show (only) years?

chemcookit said...

That's really nice :)
I'll try it soon!

I have also another very silly question that I didn't know where to post exactly. I implemented the peek-a-boo option on all my posts, but for some reason, it looks like some of my readers cannot see the 'read more' link and never find out that the posts continue.. I guess in my template the Read More turns out with a too light color.
Could you please explain to me how to have the 'Read more' link show up maybe red, bold and in the center, something that shows up better?
Thank you SO much for everything!

Ramani said...

Chemcookit,

Yes, you can play with how Read more link appears. Find the text "Read more..." in the template and replace it with

#span style="color:red;font-weight:bold;">Read more...#/span>

(I have used # instead of left arrow to get this comment going)
You may want to do the same for "Summary only..." also for uniformity.

chemcookit said...

Ramani,
thanks a lot!!! You're so nice with me poor ignorant blogger :)
If you ever want some cookies or similar that I can ship, let me know.. :) :)

River said...

Hey, thanks for the info on the three column template. Made it very simple to do when I was feeling too lazy to work it out myself.
Cheers!

Mario said...

Do you take requests?

My archives are a daily flat list. I would like to list them by title of post rather than date of post. As far as I can tell beta blogger does not allow this. Any chance you can make a hack that would do it? I would sure appreciate it.

Mario

mm@gorge.net

http://www.terrastinaandmazolli.blogspot.com/

Ramani said...

Mario,

I get many requests, so I usually pick the ones that many ask for and it should also interest me. Before I decide on your request, do you know that the post titles are shown if you choose Hierarchy view of archives?

Mario said...

I do know that, but I don't want the hierarchy view because it just clutters up the layout. I really don't need dates on my blog at all. I'm archiving daily and having the year or month listed is just an annoyance for the blog I'm doing, which is a serialized novel. I just want a place where people can go and see all the episodes of the novel in one long list. They can do that now, the way I have it set up, only instead of titles, they see dates, which is really irrelevant information.

Thanks for considering this hack.

Mario

Ramani said...

Mario,

I think what you are asking can be achieved using this Table of contents hack by Hoctro. Check out this hack.

Mario said...

That is terrific. Thank you very much. I will try it later today.

Arpit said...

Thanks yaar..
its really great
Arpit
http://www.technicalbliss.blogspot.com

Slow Food said...

ramani...thanks for responding to this request...much appreciated...keep up the great work

CD said...

This is a great hack. I just added it to my blog! Thanks for your hard work in developing this.

Kanchana said...

Ramani,

This is amazing. Only thing is I want to know how to add multiple drop downs under the same heading. Its for recipes..see the prob on my blog.

www.kanchspot.blogspot.com

Any help you can give would be much appreciated!
kanchana

Avid Blogger said...

Cool....
i cant wait 2 try for it..


http://noctrlc.blogspot.com

JourneyWild said...

Thank you very much. I've looked all over for an easy way to make drop down menus, with no luck. The process is simple, the results look professional!

Amit said...
This comment has been removed by the author.
Amit said...
This comment has been removed by the author.
Dex said...

my drown menu is already installed successfully, but can i modify it so that when i click the menu , the page will open on the same page? if yes, how? check it here: http://guidetophilippines.blogspot.com

Amit said...

Hi Ramani,

This is a very useful hack. I have the same question as the previous person. I don't want to open the selection in a new window, but in the same window. How would I do that?

Thanks.
-Amit

REDSOX said...

This blog is great. It really gave me some great ideas for my blog. My favorite was the drop down menu.

~www.redsoxrulez.blogspot.com~

Mom Unplugged said...

I love the menu, thanks! It was so easy.

Just one question, is there any way to change the size of the box? The box is longer than my sidebar and I would like to shorten it (if you want, you can see it in my right sidebar)

Thanks so much!

justvenkys said...

I have added it to my blog, I am exactly looking for this kind of thing. Reallly thank you for this code. All the bestt

Sharon E. Herbert. said...

Thank you very much for this code. I have added it to my blog and appreciate the small amount of real estate it occupies! Great blog, I come here often.

cowboytf said...

I searched everywhere for this widget and couldn't find anything that would come close to being this user friendly. I do have a question. I don't suppose you can change the color of it..so it blends in with the template??

Miss Beth said...

Hi! I am so ignorant with stuff like this--the fill in page is great! There are a lot of "lists" I want to turn into drop down boxes.

However, 1) how would I add a picture for each "list" (from my "My Pictures" folder on my computer); 2) How would I make sure things stay alphabetized; 3) when I tried to do a new box, I couldn't delete the "old" information from the "original" I tried--how would I do that?

Thanks! Miss Beth @
http://missbethsvictorydance.blogspot.com/

Miss Beth said...

Oh, and I forgot #4--How could I incorporate a long list of quotes that don't have links into a drop down box?

Thanks again,
Miss Beth @ http://missbethsvictorydance.blogspot.com/

Ramani said...

Miss Beth,

It's not possible to do all that right now. I am not sure if I will improve this utility further.

lazy said...

A Big thank you for the drop down box,right have 2 things to ask..1 how do you update the box with more links? and 2 can you change color of it? many thanks Lazy
http://bloggersdelite.blogspot.com/

lazy said...

how do i update in the drop down?,I have looked on your page and no luck? Lazy

Ramani said...

lazy,

I haven't yet made an interface to update an existing drop down menu. Right now, you will have to recreate a new menu with all the options again. I will inform everyone with a new post if I add this feature.

net-place said...

nice article dear.Will give it a try.keep posting such hacks...

Arti Honrao said...

The link does not work :(
I need this hack

http://www.anniyalogam.com/hackosphere/widgets/dropdown.html

it says
Not Found

The requested URL http:// was not found on this server.


Please help
My blog

Straight From The Heart



GBU
Arti

Ramani said...

Arti,

I fixed the link. Please try again.

The Cartoonists Cookbook said...

I created a few drop down menus but I'd like to add a few links to the list once a week. Is it possible to add links to the drop down menu at a later date or do you have to add them all at once and then that's it?