Blogger Hacks, Categories, Tips & Tricks

Tuesday, July 26, 2005
Drop-Down Menu [s]
Many thanks to Mark at Escape from Obsession for encoding the drop-down menu for del.icio.us tags & sharing his efforts with the world. Much appreciated!!

I have added this feature, initially including only those tags that I've used more than 20 times, & adding an "all categories" link that goes to my del.icio.us homepage.

Excellent. Thanks, Mark!!

Update 7/27: After visiting Miles to Go, where there are del.icio.us categories in the works too, I have decided that I like drop-down menus for making the sidebar tidy. Miles to Go even shows different drop-downs, depending whether you're on the homepage, a post page or an archive page. So, more menus. The code for the archive menu for blogger came from Li Zhao. Here's my implementation:

<p style="text-align: center">
<select name="ArchiveMenu" onChange="location.href=this.options[this.selectedIndex].value;">
<option value="/">- Archives -</option>
<BloggerArchives>
<option value="<$BlogArchiveURL$>"><$BlogArchiveName$></option>
</BloggerArchives>
<option value="/">Current Posts</option>
</select>
</p>

See other posts in Blogger Hacks: The Series

Posted at 8:42 AM by John.
23 Comments:
<    >
Blogger kweenie said...
Is there any way to order the archives descending, in spite of ascending,, doing this a while the active month is dropping lower and lower, Ive seen the script to turn over the sorting, but it wont work together
the script can You help me out,, I've had a result but it was a real mess..

<    >
Blogger John said...
There are a couple of good hacks that you might want to try to reverse the order of your archives.

To reverse the archives in a drop-down menu, use the roveberg hack at: http://www.roveberg.com/2004/10/blogger-hack-reverse-sort-archive.html

To reverse without a drop-down, try Witfits, about halfway down the page:
http://witfits.blogspot.com/2005/04/katos-blogger-hacks-part-2.html

Both involve taking out the default archive code and replacing it with new code offered in the hack post.

<    >
Blogger Thérèse said...
Thank you for this. It's exactly what I was looking for.

<    >
Blogger Verne's Adoption said...
I really like this drop down, is there a way to make it the same color as the backgroud?

<    >
Anonymous Anonymous said...
how do i do a drop-down menu for my tags/catgories? really love the tips uve been posting!kepp it up

<    >
Blogger John said...
Raf,

For the latest in sidebar-dropdown-tag menu goodness, get thee some Freshtags!! Freshtags lets you style your del.icio.us tags and the sub-list of post titles that appears when you select a tag. Drop-down is one of the options. Head to the Freshtags build page to generate the code that will work for your blog. You can see it in action in my sidebar in the "freshtags navigation" section under "topics", and on all the blogs that are blogrolled in that sidebar section. Comments / Questions? Visit my Freshtags post, and watch for a service upgrade in the near future.

<    >
Anonymous Anonymous said...
is there anyway to match the background and the font in the drop down box to the template?

<    >
Blogger John said...
It would appear so.... a quick Google search for "styling forms with CSS" turned up some good-looking resources, including a Sitepoint article that explains how to change backgrounds & fonts. I might have to check it out myself!

<    >
Blogger Dilip Mutum said...
Thanks a lot John. Was looking around the web trying to find ways to shorten my sidebar and the drop down menu for my archives did the job. Thanks again.

<    >
Anonymous Anonymous said...
Thanks .. very useful for me

<    >
Blogger Leesa said...
Is there any way to hard code what the drop-down items are? I have a list of stories and I would like to use them as a drop down.

<    >
Blogger John said...
Leesa,

You can build a menu like that w/ an automatic online tool. Try it out!

<    >
Anonymous Anonymous said...
Thank you, just what I needed. I figured out how to make a link dropdown menu, but no luck with the archive menu. Until now.

<    >
Blogger Mobile Depot said...
You made my blog more pro-looking more power to you and a million thanks.

<    >
Anonymous Anonymous said...
any chance u can make this work with ecmanauts next previous link hack?

<    >
Anonymous Anonymous said...
Hey, i'm from another blogger site, www.tardisnewszone.blogspot.com, but as you may see, I have an episode guide. Is there anyway in which I can use the dropdown menu for the episode guide, as its starting to take up space. Any help would be appreiciated.
Regards, Cloak.

<    >
Blogger Cristalle said...
i see this code but where do i put it in the template?

<    >
Blogger Greg said...
This sort of approach morphed into the FreshTags project - if you're using the latest Blogger, then check out Singpolyma's version.

<    >
Blogger anna said...
thank you!!
it's helped de-clutter my sidebar! you're genius! =)

<    >
Blogger iceop said...
thanks a ton! how can i change the font in the dropdown?

<    >
Blogger Steven R. McEvoy said...
I host my own blogger blog and just spent 2 hours searching for a way to do this. Thanks for a perfect solution.

<    >
Blogger Garinda said...
Hi John,

I am looking for a html code or a way to make my post title becomes drop down menu exclude date/month. Do you have any idea to help me, please.

check my blog at
http://garinda.blogspot.com

<    >
Anonymous Pravin said...
A dynamic multi level menu in PHP/MYSQL/JavaScript at http://pbswork.blogspot.com/2009/07/dynamic-multi-level-drop-down-menu.html


eXTReMe Tracker