Alright, I promise I haven't gone completely drop-down crazy... Well maybe just a little....
Here's the code to turn your "recent posts" display in your blogspot blog into a drop-down menu.
<p style="text-align: center">
<select name="PreviousItemsMenu" onChange="location.href=this.options[this.selectedIndex].value;">
<option value="/">- Recent Posts -</option>
<BloggerPreviousItems>
<option value="<$BlogItemPermalinkURL$>"><$BlogPreviousItemTitle$></option>
</BloggerPreviousItems>
</select>
</p>
I modified Li Zhao's code for the archive drop-down to work with the "10 most recent posts" display in blogger. Let me know if it works for you.
I used centricle to convert the code so that it would display in this post. Thanks to Improbulus for the tip.
See other posts in Blogger Hacks: The Series
]^23003]^23900]navy],](](]]]black],]3]1]2]3]1]1]4]1]2]3]1]1],](](]^23FFFff])])]Freshblog]Blogger^20Hacks^2C^20Categories^2C^20Tips^20^26^20Tricks],](],](](]^23900](](](]^23666](](](]^23900](],](](]75]20],](](]^23FFF])])]^23900]1.5]15],](](]^23999])])]^23900]^23CCC])])]^23900]30]^23003]^23003],](](]^23333](],](]^23003]^23039]^2306C],](](]^23CCC])])],](](]^23EEE])])],](](]^23CCC])])],](]^23006]^23666]15]3]25]20]^23003],](](],](],](](],](]^23003](](](],](](](],]black](](](],](](]black](](](](](],]^2336F]^23003](],](]Posted^20at^20^24TIME^20by^20^24AUTH.]20],](](]^23900])])]^23CCC])])]^23666]30]black]black],](](]^23333](],](]^23333]^23039]^2306C]Freshblog]]]Home]^24HOME]First^20Page]Email]^24EMAIL]Mail^20me^21]RSS]^24RSS]RSS^20Feed]Comments^20Feed]]Comment^20Feed^20]Archive]]]^24ARCHIVE]^20]]Freshtags]]]Horm])blog.horm.org]Hallucinations^20Of^20Reabsorbed^20Mind]Phorm])p.horm.org]Another^20Phormation]Etc]]]^3Cimg^20src^3D^22)psyc.horm.org/barimg/bar_psycho.png^22^20width^3D^2280^22^20height^3D^2215^22^20alt^3D^22PsycHo^3A^20Free^20Template^20Generator^22^20style^3D^22border^3A^200px^20solid^20black^22^20/^3E]^24PSYCHO]PsycHo^3A^20Free^20Template^20Generator]^3Cimg^20src^3D^22)psyc.horm.org/barimg/bar_firefox.png^22^20width^3D^2280^22^20height^3D^2215^22^20alt^3D^22Get^20FireFox^21^22^20style^3D^22border^3A^200px^20solid^20black^22^20/^3E])www.mozilla.org/products/firefox/]Get^20Firefox^21]^3Cimg^20src^3D^22)psyc.horm.org/barimg/bar_xhtml.png^22^20width^3D^2280^22^20height^3D^2215^22^20alt^3D^22XHTML^20Validator^22^20style^3D^22border^3A^200px^20solid^20black^22^20/^3E])validator.w3.org/check/referer]XHTML^20Validator^26^2361470^3BPsycHo}){kind=small}
And this is a great tip from you too, shall give it a go!
http://del.icio.us/doc/feeds/js
I'm considering trying it, although I really like your idea of using drop-down menus for categories, archives, and possibly recent posts. I haven't decided whether or not to implement any of those, but rest assured I'll give you due credit... :-)
Now if I can just figure out how to make the two menus the same width.
You can put it wherever you like. As a straight swap-out, it should replace the bloggerprevous items tags.... You can comment them out, insert the new code, and preview your page so that the changes aren't irreversible. It can go anywhere you like, though, so experiment 'til it looks good w/ your template!
The Bleeding Ear
Any ideas?
has anybody figured out how to change the text length in the drop down menu, so that it can be shortened in teh drop down menu?
emailing me at BlogsoupATgmailDOTCOM would be great.
thank you in advance for any help you might have.
select { width: 10em; }
input[type='submit'] { width:auto; }
input[type='button'] { width:auto; }
input { width: 10em; }
input[type='image'] { width:auto; }
I inserted the code and it works perfectly.
At least for Firefox. For IE the dropdownmenu doesn't expand when clicked on so it is impossible to read the longer post-titles.
Anyone a sollution? (besides adding a button "best viewed in Firefox")
Arne.
Here's a link to my blog so you can see what I mean.
It will default to accomodate your longest post title. You can use CSS to limit the size of the unselected box. See Stephen's comment on Freshblog.