Create Dropdown menu for Labels


The label widget is visually great if you're using a minimal number of categories to your blog but usually, many of us exceeded the number labels  we used. As the article content of our blog continues to increase, we also add more labels.

Too many labels simply puts the blog template especially the sidebar in disarray!

To solve the widget list problem.... We must now convert the widget to a 'DropDown' Label Menu. It is the best option even if your using hundreds of different labels.

1. Log-in to your Blogger Account.
2. Go to your Dashboard > Template > Backup/Restore >
   Back Up you Template!

3. Go to your Dashboard > Template > Edit HTML >

4. Remember: Don't Expand the Widget Template -- Do not put a check at the checkbox.

5. Search the HTML code [below] for your label widget.
view plainprint?
  1. <b:widget id="Label1" locked="false" title="Labels" type="Label">  
  2.   
  3. </b:widget>  
6. After you found the above HTML code, you can now replace it with the new code below...
view plainprint?
  1. <b:widget id="Label1" locked="false" title="Labels" type="Label">   
  2. <b:includable id="main">   
  3. <b:if cond="data:title">   
  4. <h2><data:title></data:title></h2>   
  5. </b:if>   
  6. <div class="widget-content">   
  7. <select style="width:100%" onchange="location=this.options[this.selectedIndex].value;">   
  8. <option>Click to choose a label</option>   
  9.    
  10. <option expr:value="data:label.url">   
  11.   
  12. </option>   
  13.    
  14. </select>   
  15. <b:include name="quickedit">   
  16. </b:include></div>   
  17. </b:includable>   
  18. </b:widget>  
7. Save the Template!

Optional:

If you want to include the post count of each label, just ad this code (< data:label.count />) at Line Code no. 11

In line code no. 8: You can also change the 'Choose a Label' phrase with another phrase or just use the words Tags or Category.

No comments:

Post a Comment

Popular Posts

Best Blogger Gadgets