If you have a long list of labels in your sidebar, you could be losing valuable space to display other information. A different method of displaying your labels is to use a drop-down menu: this takes up very little space at all, and is useful for helping your readers find the information they need. This post explains how a drop-down menu for your blog labels can be achieved in just a few easy steps.
This hack was originally developed by Ramani of Hackosphere, though for this tutorial I have further simplified the process so there are only two steps required:
- First you should make a back-up of your existing template by going to Template>Edit HTML in your Blogger dashboard and clicking the "download full template" link which is near the top of the page. It is always good practise to back-up your template before making any modifications at all, just in case you make a mistake and later need to use your old template again.
- Next you will need to find the following line of code in your blog's template:
<b:widget id='Label1' locked='false' title='Labels' type='Label'/>
To find this line, you do not need to tick the expand widget templates box. This is the un-expanded tag used to display the label widget in your blog template. Highlight all of this line, and replace this with the following section of code:
Then save your template and take a look at your new drop-down menu!
Once installed, you can then move the label widget to other areas of your blog in the layouts section of your dashboard, just like any other widget.
I hope this tutorial has been useful to you. Please feel free to leave your comments and suggestions below.
Technorati Tags: blogger | labels | drop-down | menu | javascript | sidebar




Thank You Thank You Thank You!
ReplyDelete=D
for now I don´t need, but my list is growing!!
ReplyDeleteby the way, I would like to know a way to edit the labels I choice in all my posts, not having to go edit each one and change the labels
like now, I have a label called Paid.nu, now I want to change all my posts with that label to other name, Paid.vg
:S
Great hack! I've been wanting something like this! For some reason when I add it, I get errors saying "this isn't well-parsed." Even on things that were already in my html before pasting this. Ugh.
ReplyDeleteto dav7:
ReplyDeleteI just did this this morning. It's very simple, really. Under the "Posts" heading, hit "Edit Posts" and to the left you'll see a list of all of your labels. Simply click on your "Paid.nu" label link, and it'll give you a list of all of the posts with that label. From there, click the "All" next to the drop-down menu, and then in the drop-down menu at the bottom click "New Label..." and enter "Paid.vg" in the dialog box. That label will then be applied to all of those posts. Then, click the drop-down menu again, and at the very bottom they have an option to remove labels. Select "Paid.nu" and it'll be removed! And there you go!
Hope this helps, and doesn't confuse you! =P
Happy Thanksgiving!
woooowwww
ReplyDeleteI had never notice that!!
now is done easily!!
thanks a lot :D
thanks we are using it :)
ReplyDeleteHi Amanda
ReplyDeleteur site is very helpful...
Amanda do you have a hack for drop down listing of each label in the Label list.
It would be really really very helpful.
It's very helpful. I'm using it now. Thank you very much!
ReplyDeletehey, thanks a lot Amanda!
ReplyDeleteThis is a great solution, just the one I was looking for.
Do you know, per chance, any way of changing the color, i.e. reversing type and bckgrnd, black to white? I was looking at the script, but being more designer than coder, couldn't figure out how...
Thank you so much!
I had just deleted my labels widget because it had got too long. Your instructions were clear and easy...thank you!
ReplyDeleteWow! Fabulous!!!! I love the labels option, but hated how much room it took up on the side. Thanks!
ReplyDeleteHi Amanda:
ReplyDeleteThanks for a great widget (label drop down).
Question: is there a way to 'clean up' the look? I noticed that the drop down bar is a little too low, in regards to the Labels title. Thanks.
Scott
Amanda,
ReplyDeleteThank you very much!!!!!
I am placing a post on my blog, speading a word about your solution:
ReplyDeletehttp://blogging4good.blogspot.com
Thanks for this code it really helps I am placing it at http://newzaroundus.blogspot.com :)
ReplyDeleteAm I seriously the only one who doesn't have Label in my html??
ReplyDeleteAnother good one Amanda. :) Thank you!
ReplyDeletei've tried this on as well as the top commenters. it's now in my site and i like it. you've got a very informative and helpful site especially to a newbie like me. keep up the good work!
ReplyDeleteI was just wishing for drop-down labels and then I stumbled across your blog with instructions. Very cool! Thanks so much!
ReplyDeleteHi Amanda,
ReplyDeleteYour blog is really very helpful. I am now using this technique.
However, I am having some problems about the 3-column footer and tab view installation.
I send you a separate mail through Entrecard and I hope you find time to read it.
Thanks really.
hi amanda, i wanted to say a big thank you for sharing this info! i've installed this widget, your instruction is simple & it works well with me! Thanks alot!! A big hug to you!! :)
ReplyDeleteJean Chia
Perfect. Thank you!
ReplyDeleteThanks for a quick and easy labels fix. My labels had pushed everything else in my sidebar "below the fold". This is so much neater!
ReplyDeleteBTW, I happened on your blog a couple of months ago while searching for info on customizing templates. Yours is the best I've seen. So far I have converted my standard Rounders3 template to a wide (bt still 2-column) version and started using the post summaries customization. I think tabs are going to be next!
Hi Amanda,
ReplyDeleteThis tutorial is great. Very helpful.
I'm using it in my blog.
Thanks a lot. You're such an angel.
Hi Amanda I really love this and have been looking for something like this to fix my labels so thank you :)
ReplyDeleteIs there a way to change the size of the drop down box ? its ruining my beautiful template :P :) cheers v
You are a lifesaver. I just did this and it worked just as I wanted. Before I started reading your website this afternoon, I was seriously considering moving my blog from blogger to wordpress because I haven't been able to do what I want with my blog. Now I'm going to continue reading your advice and follow some of your pearls of wisdom.
ReplyDeleteWOWWWWWW!beautiful trick!!!
ReplyDeleteJane if you would change the size this is the STYLE code:
select onchange='location=this.options[this.selectedIndex].value;' style='width:200px; background-color:#fff; color:#000;'
the width is 200px but i think you can change this!
This comment has been removed by the author.
ReplyDeletei haxw a request:
ReplyDeletesee my blog,
http://fotografiaprofesional2008.blogspot.com/
is only a column and I want to position all the widgets with dropdown menu On An Unique Horizontal Line! is it possible? please help me!
Fantastic space saver and used it in conjunction with the Show labels without the post count hack, I've managed to do a drop down menu with the label count. Its all here for all to see at http://royedsworld.blogspot.com
ReplyDeletesomeone else asked and answered this already but i didn't understand the response, hopefully you can clear it up for me. the background of my blog is black and the font is white. is there a way to make the dropdown black with a white font also so it matches? Thanks
ReplyDeletebeautiful! worked like a charm, thanks!
ReplyDeleteHi... works great. Thanks heaps
ReplyDeleteis there a way to create this for archives in the classic template?
ReplyDeleteThanks a lot. It looks much better now. :)
ReplyDeleteAmanda, Amanda, Amanda. Do you know how brilliant you are? Myself and everyone else here think you are!
ReplyDeleteI have been looking (whenever I had a chance) to find a drop-down widget specifically to solve my ever-growing list of labels. They all had a (for me!) very complicated installation procedure or too many bugs.
I even changed my template to one that HAD drop-downs (from someone else). But it could only show about 50 labels before running into problems.
Then I discovered your site a couple months or so ago and am now using one of your templates. Very happy with it.
Then yesterday, I found this drop-down widget here. Unbelievable. So simple to install, as you said it would be. I made one change after installation to customize the info box by expanding the widgets first. Again, no problems. I also moved it from the sidebar to
a more appropriate position (for the kind of blog I have).
Life is now good for me thanks to you!
Vic
This was really helpful - thank you so much.
ReplyDeleteDina @ mamadinis
Amazing trick...Thanks !!!
ReplyDeletehttp://exclusivearena.blogspot.com/
thanks for help http://www.computersolution.co.cc
ReplyDeleteThanks, but how can I integrate this drop down menu with the TOC collapsed labels hack? I think I've done it correctly because it seems to be working. I got rid of the onchange part and replaced it with action="#toc" because I have an a name tag placed above my TOC. Then I made the hack change by changing the expr: in your code to the expr: from the hack. The action="#toc" may not be necessary though. I implemented it into my test blog before messing with my main template first and played around with things.
ReplyDelete< and > are removed in the code below so it'll show up.
select action='#toc'
option Select a label /option
b:loop values='data:labels' var='label'
option expr:id='data:label.name' onclick='javascript:showLabelPosts(this)' data:label.name/
( data:label.count/ )
/option
/b:loop
/select
Of course, I've added the additional script and page element according to the code at growyourblog.blogspot.com
Ugh...Correction
ReplyDeleteIt appears to work in Firefox 3.0, but not in Safari.
as always you are a lifesaver :)
ReplyDeleteThank you Amanda for your wonderful tutorials.
ReplyDeletemy blog is http://mumbaidailysnapshot.blogspot.com
and I have mmade it 3-column in minima blue.
I have also put the labels drop down menu, as you have instructed so well. Is there a way of changing the backgroung of the menu. It is white. I want it sky blue to match my blog. And how can I reduce the width a little?
Amanda, thank you! thank you! thank you!!!!
ReplyDeletexoxo
Thank You! I had one on my blog, but all it did was cause popups!
ReplyDeleteI am so happy to have found your tip on doing this and the popups are now gone. lol
This is exactly what I was looking for. Brilliant. However, it's too wide and I can't see the scroll bar. How do I change the width?
ReplyDeleteI think there is ISSUE with this code... it does show labels in drop down... but after implementing this...
ReplyDeletesay i select labelw ith 40 posts, it showed all 40 posts on one page, even though i have setup 7 posts per page in settings.
Doing something wrong or more coding needed to fix this?
Umm I don't seem to have that line in my HTML... is it because I'm using a different kind of template?
ReplyDeleteIs there a way to put it in?!
Woohoo..worked perfect too easy! :-))
ReplyDeletei dont have that line of code..help!
ReplyDeletei have DOTS templtae
Thanks so much for this tutorial on drop down menu for labels. It helped saved a lot of space and makes the page neater :)
ReplyDeleteThanks!!!
شكرا لك ..
ReplyDeleteاستفدت منك كثيرا
English translation:
Thank you ..
I benefited you many benefits
Thank you so much for this.
ReplyDeleteIt really helped my blog alot, especially since I'm blogging for an entertainment blog, there's so many labels!
You're a legend!
http:://iaretalk.blogspot.com
thanks so much
ReplyDeleteworks wonderfully
Once again, so so so so so AWESOME!
ReplyDeleteWOW I would SOOO much like this widget! But the picture doesn't work, so I don't know what to replace! can you help me?
ReplyDeleteThanks, It really helps...
ReplyDeleteI'm completely new @ this and your tutorial was amazingly simple to use! THANK YOU.
ReplyDelete--- Dyn
http://head-lint.blogspot.com/
how about a dropdown menu for blog archive? please..thanks!
ReplyDeleteNOOO :D
ReplyDeleteWHERE IS THE CODE? xDD
I finally found the widget I was ever dreaming of and now it says "Service Temporarily Unavailable"
WTF :D:D
How can I change the width of the widget? this one is too wide for my sidebar
ReplyDeleteThank you. It works perfectly! :-)
ReplyDelete111 Labels with many more to come considering the fact that I've been blogging only for a month. I must say this is my first visit and I'm a fan already. Keep up the great work guys. Thanks a ton
ReplyDeleteManish :)
http://surrealnirvana.blogspot.com/
Hello,
ReplyDeleteMy name is mohamed
I just pasted the code in HTML but I am not able to follow the other step
Please help
Thanks Amanda.Finally i found this hack .i am thinking about it for along time.
ReplyDeleteawesome! works perfectly! thanks a lot amanda!
ReplyDeleteThank you very much for the info, but i dont want my label in one list. i want to go back in my orginal stage is it possible?
ReplyDeletethanks for sharing it . it is very easy to understand I will implement it in website design
ReplyDeleteI can't see what is in the second box(the code that I should input. please if anyone can see it copy it for me in your comment. please please please I need this
ReplyDeleteThank you, Amanda! Works fine!
ReplyDeleteHave a nice weekend!
Alper
--
http://www.bulut.de/
Beautiful,however it would be astounding if the labels could present themselves in alphabetical order ;>)
ReplyDeletethanks for the trick, helps reduce the clutter on my blog.
ReplyDelete<3
Hey Amanda,
ReplyDeleteHow can i add two label categories i.e.,
Online Games:
Arcade
Puzzle
Management
..........
........
........
and
Download Games:
Action
Arcade
Puzzle
Kids
Tycoon
.........
.........
like this i want to add two different label categories online and Download Games...
How can i add?
My blog: http://saku-games.blogspot.com/
I want like this blog:
http://www.gamezlinks.net/
Please help me Amanda, it's Urgent
Thanks in Advance
Thank you so much for this. I am always afraid I am going to do irreparable damage to my blog, but your tutorial was easy and soooo helpful. Thanks again.
ReplyDeleteHey, I can't see the code, it says this:
ReplyDeleteService Temporarily Unavailable
The server is temporarily unable to service your request due to maintenance downtime or capacity problems. Please try again later.
Apache/1.3.33 Server at bloggerbuster.com Port 80
Can someone copy and paste that code here?
thanks for you
ReplyDeletewww.tempobox.blogspot.com
Amanda, Help.
ReplyDeletewhen i tried to put this code into blogger, i got this message:
Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: The element type "b:section" must be terminated by the matching end-tag "".
Hi, Amanda --
ReplyDeleteIt looks like the code is gone (there's a message that the service is temporarily unavailable). Can you repost this? I really need this widget!!!!!!!! :)
Thanks
Hi Amanda,
ReplyDeleteI got the same error msg as Emily as quoted on top:
We were unable to save your template
Please correct the error below, and submit your template again.
Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: The element type "b:section" must be terminated by the matching end-tag "".
Need your help there. Thanks :)
Hi Emily,
ReplyDeleteThis is for all those who are getting the same error as yours. You get this error because you might be clicking on Expand Widget Templates. Make sure you dont click there and search for the line as Amanda has told, replace it with the piece of code and then this code works fine :) Incase you still face the problem you can get back to me here:
http://dummy-essentials.blogspot.com/
will be glad to help u out.
Oh no. I tested this code out not too long ago and worked great. At the time, I didn't think I needed. Well, now I would love to have it and now the "Server Temporarily Unavailable." Bummer.
ReplyDeleteOh Yay!!! I was able to get it! Thank you very much. Having the pull-down labels really helps clean-up my sidebar.
ReplyDeleteThank you,
Nicole
Thanks a million
ReplyDeleteThanks a lot for the tips!
ReplyDeleteThanks for sharing this little tweak. Very helpful.
ReplyDeleteGot a question, is it really necessary to display 'Labels'? What are the disadvantage of removing 'Labels' in our blogs?
Thanks
Thanks Dummy Essentials for posting the link,,, it really helped.
ReplyDelete:(
ReplyDelete"Service Temporarily Unavailable
The server is temporarily unable to service your request due to maintenance downtime or capacity problems. Please try again later. "
good work man
ReplyDelete...................................
http://pcsoftwaresdownloadplace.blogspot.com/
...................................
TY for the help :)
ReplyDeleteBeautiful! I cannot believe how easy that was! I changed the title to "Directory of Post Labels" because my blog is mainly about directories of special needs resources and I was so thrilled to see it work the first time! Thank you!
ReplyDeletewow nice article discussion thx for sharing
ReplyDeletehttp://www.top100moneymakingways.blogspot.com/
Please tell me you still have this code?! I've been looking every where for this option. Right now your iframe has godaddy.com. :( Thankyou!!!
ReplyDeletehi where is the code?
ReplyDeleteWhere is the code at Amanda? Godaddy.com is where the code should be!
ReplyDeletegreat tutorial..thanks for sharing
ReplyDeleteNice post! Introductions and greetings of friendship from me.
ReplyDeleteThere's some great resources/info on this blog, but it seems to have become more and more neglected by it's owner over the past year or so, with things not working properly or similar which is a shame
ReplyDeleteUh-oh...where's the code? I don't see it!
ReplyDeleteThanks for taking the time to discuss this, I feel strongly about information and love learning more on this. If possible, as you gain expertise, It is extremely helpful for me. would you mind updating your blog with more information
ReplyDeleteI am thoroughly convinced in this said post. I am currently searching for ways in which I could enhance my knowledge in this said topic you have posted here. It does help me a lot knowing that you have shared this information here freely. I love the way the people here interact and shared their opinions too. I would love to track your future posts pertaining to the said topic we are able to read.
ReplyDeletei am donna pinto,from what I can read. It has been sad news and scam to everyone about spell casters or so. But to me they are so real cause one worked for me not quite two weeks. I traveled down to where his shrine his and we both did the ritual and sacrifice. I don't know about you but spell is real;love marriage,finance voodoo, get your ex back voodoo,love voodoo,lottery voodoo,weight loss voodoo,money voodoo, business voodoo,it's all he does. I used my money to purchase everything he used he never collected a dime from. He told me I can repay him anytime with anything from my heart. Now I don't know how to do that. If you can help or you need his help write him on nativedoctor101@live.com. Thank you.
ReplyDeleteI am nancy,from what I can read. It has been sad news and scam to everyone about Voodoo casters or so. But to me they are so real cause one worked for me not quite two weeks. I traveled down to where his shrine his and we both did the ritual and sacrifice. and now me and my ex are living very ok now.I don't know about you but Voodoo is real;love marriage,finance, job promotion ,lottery Voodoo,poker voodoo,golf Voodoo,Law & Court case Spells,money voodoo,weigh loss voodoo,diabetic voodoo,hypertensive voodoo,high cholesterol voodoo,Trouble in marriage,it's all he does. I used my money to purchase everything he used he never collected a dime from. He told me I can repay him anytime with anything from my heart. Now I don't know how to do that. If you can help or you need his help write him on (nativedoctor101@live.com) Thank you.
ReplyDeleteI’ve been visiting your blog for a while now and I always find a gem in your new posts. Thanks for sharing.
ReplyDeleteI appreciate your blog..Keep posting this type of articles..Its really a wonderful job done by you.
ReplyDeletei cant see the cde in second step ,why ? plz help
ReplyDeleteGood article and very valuable information. Keep it up!
ReplyDeleteWhere's the code?
ReplyDeleteDo you have a code for the "page" drop down menu?
ReplyDeleteGreat article about Drop Down menus..really interesting here.
ReplyDeleteweb design company
I'm still learning from you, but I try to reach my goals. Since then enjoy reading all the information that appears on your blog.Keep come. Loved it!
ReplyDeletebuy ritalin online
You made some good points .I did a little research on the topic and found that most people agree with your blog. Thanks.
ReplyDeletebuy xanax online
Very thanks. I believe there's even more that could be on there! Keep it up
ReplyDeleteI like the valuable information you provide in your articles. I’ll bookmark your weblog and check again here frequently. I am quite sure I will learn many new stuff right here! Best of luck for the next!
ReplyDeleteGood article and very valuable information. Keep it up!
ReplyDeleteWonderful site and I wanted to post a note to let you know, ""Good job""! I’m glad I found this blog. Brilliant and wonderful job ! Your blog site has presented me most of the strategies which I like. Thanks for sharing this.
ReplyDeleteThanks to share with us the information. I wish you good luck!
ReplyDeleteI have no words to appreciate this post ..... I'm really impressed with this post .... the person who created this post was a big thank you man .. for sharing with us.
ReplyDeleteWell described in above article.
ReplyDeleteIts very informative and impressive.
Thanks for your update.
Great tips, I would like to join your blog anyway,
ReplyDeleteI have read a few of the articles on your website now, and I really like your style of blogging. I added it to my favorites blog site list and will be checking back soon. Please check out my site as well and let me know what you think.
ReplyDeleteIt is very interesting for me to read that article. Thank author for it. I like such topics and everything connected to this matter. I definitely want to read more soon.
ReplyDeleteYou’ve written nice post, I am gonna bookmark this page, thanks for info. I actually appreciate your own position and I will be sure to come back here.
ReplyDeleteThese kind of post are always inspiring and I prefer to read quality content so I happy to find many good point here in the post, writing is simply great, thank you for the post.
ReplyDeleteIncredible, what an amazing way to express your opinion…very cool I must say …
ReplyDeleteI think you are right when you say this. Hats off man, what a superlative knowledge you have on this subject…hope to see more work of yours.
I am jeannet used every single spell worker on the internet, spent untold amounts of money and discovered they are all fakes…i was the fool though; doing the same thing over and over again and expecting different results. In the end, I decided that I wanted a tarot reading to know what my future held for me; I contacted a woman who lives locally to me and she told me about a man named (priests sangojagaban); he does not advertise on the internet, has another job for income, has no set prices, makes no false promises and refuses to help anyone that cannot be helped and even helps for free sometimes, he will give you proof before taking money. He is a wonderful man and he was the only person who actually gave me real results. I really hope he doesn’t mind me advertising his contact on the internet but I’m sure any help/ extra work will benefit him.contact him as jagabansukia101@gmail.com He travel sometimes.love marriage,finance, job promotion ,lottery Voodoo,poker voodoo,golf Voodoo,Law & Court case Spells,money voodoo,weigh loss voodoo,any sicknesses voodoo,Trouble in marriage,it’s all he does Hope this helps everyone that is in a desperate situation as I once was; I know how it feels to hold onto something and never have a chance to move on because of the false promises and then to feel trapped in wanting something more.
ReplyDeleteA healthy diet is not about strict nutrition philosophies, staying extremely thin, or depriving yourself of foods you love. Rather it is to get that good to have more energy and you keep healthy as possible.
ReplyDeleteThis collections are works of art in digital perspective. Thumbs up.
ReplyDeleteWOW!!! How amazing post is! i like your article on here very much. thank you for your sharing. and i think you can't lose hope for my introducing. Welcome to visit mine
ReplyDeleteThanks for your many years of a great service well done! I’ve always felt good about listing my concerts with you and linking from my website.
ReplyDeleteThis page is a great method to connect to others. Congratulations on a job well achieved. I am anticipating your next entry.
ReplyDeletelocal movers in washington dc
I admire the valuable information you offer in your articles very nice.
ReplyDeleteits very good man
ReplyDeleteسعودي انحراف-
كيوت-
شات صوتي-
سعودي انحراف-
سعودي كول-
سعودي كيوت-
دردشة صوتية-
سعودي كام-
شات سعودي-
شات سعودي انحراف-
دردشة سعودي انحراف-
شات صوتي سعودي-
شات صوتي نسائي-
شات نسائي-
شات سعودي كام-
شات سعودي صوتي-
شات كول-
شات كام-
شات صوتي-
دردشة صوتية-
على مودك-
شات على مودك-
منتدى سعودي كول-
منتدى كيوت-
كيوت-
-سعودي جنان-
مشكلة النكات-
توبيكات كيوت-
دليل مواقع-
شات سعودي كول-
دردشة سعودي كول-
شات -
دردشة-
شات الياقوت-
شات كايدتهم-
سعودي جنان-
كايدتهم-
شات صوتي-
I really enjoyed the article. It proved to be very useful to me and I am sure to all the commenters here! It's always nice when you.
ReplyDeleteThese kind of post are always inspiring and I prefer to read quality content so I happy to find many good point here in the post, writing is simply great, thank you for the post free car ads.
ReplyDeleteThis is just the information I am finding everywhere. Thanks for your blog, I just subscribe your blog. This is a nice blog..
ReplyDeleteThe playwright, the set designer, the wardrobe lady, all get credit.
ReplyDeleteSome will say they give thanks to almigthy God for the giver of life, but i will give my thanks to Dr.Zabaza of zabazalogan@yahoo.com for the giver of love because without him my lover would not have come back to me. So i will really use this opportunity to show my appreciation to Dr.Zabaza. Reach Dr.Zabaza via email: zabazalogan@yahoo.com or call +2348182620374 and i assure you that your lover will definitely come back to you because he brought mine back
ReplyDelete