Create a Dropdown Menu for your Labels (Blogger)

What we will achieve through this tutorial

In this article, I’ll explain how to transform your Blogger label list from something which appears like this:

To one which appears like this:

How to create a dropdown menu for your labels

Go to Layout>Edit HTML in your Blogger dashboard (if you are not already looking at this page) and ensure you have NOT checked the “Expand widget templates” box:

Now using your browser’s search function, locate the following line in your Blogger template:

<b:widget id='Label1' locked='false' title='Labels' type='Label'/>

Highlight this complete line, and replace with the following code (copy to your clipboard and paste in place of the line above):

<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'>

<br />
<select onchange='location=this.options[this.selectedIndex].value;'>
   <option>Select a label</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>

Now preview the changes you have made to your template. In place of the 
long, reular list of labels you should now see a neat drop down menu. If
 all looks well, you can proceed to save your adjustments to your 
Blogger template.