How To Change the Labels Widget to Drop-Down Menu in Blogger

Happy Friday friends!  I'll bet you have some fun plans in the works for the weekend.  In case you are planning a weekend at home by the computer and feel like tinkering around on your blog - you might be interested in this tutorial.  When I shared my new blog design someone asked how I made the drop down menu for the labels/categories widget.  It was super easy and I believe it helped the sidebar look a little less cluttered which was my goal.  You can actually google just about anything that you want to do to your blog and get the answer - some tutorials are easier to understand than others.

To change the labels widget on blogger, here is what you do:

Disclaimer - always back up your template before making changes to html or you might end up with a huge mess on your hands.  Been there :(

  1. Log into your blog.
  2. Click design tab.
  3. Then click edit html.
  4. press the ctrl key and f simultaneously which will give you a search option.  Type in label to quickly locate this code: <b:widget id='Label1' locked='false' title='' type='Label'/>
  5. Replace this code <b:widget id='Label1' locked='false' title='' type='Label'/> with the following:
<b:widget id='Label1' locked='false' title='Labels' type='Label'> 
<b:includable id='main'> 
<b:if cond='data:title'> 
<h2><data:title/></h2> 
</b:if> 
<div class='widget-content'>
<select style='width:100%' onchange='location=this.options[this.selectedIndex].value;'>
<option>Click to choose</option> 
<b:loop values='data:labels' var='label'> 
<option expr:value='data:label.url'><data:label.name/> 
(<data:label.count/>) 
</option> 
</b:loop> 
</select> 
<b:include name='quickedit'/> 
</div> 
</b:includable> 
</b:widget>


If you would like to change the width of the menu, change the percentage higher or lower (coded in purple) to fit your sidebar.  As always, preview before saving.  Viola!  You now have more space on your sidebar!  I hope this helps!


If you like this sort of thing and would like to learn more, let me know.  I'm no expert, but have certainly wasted spent a lot of time educating myself and have more to share if you are interested.


***My wish for you this weekend is that you have time to reflect, to laugh, to love, and to be loved.  Enjoy my dears!  

No comments:

Post a Comment