How To Change Dafault Blogger Label Widget Into A Dropdown Menu.

 
Sample image of dropdown menu


In this posts i'm going to teach step by step on how to replace/change the default blogger label widget into a dropdown menu, you can add this any where you like in your blog.

Sample image of dropdown menu

1.First thing to do is login to your blogger account and add a LABEL widget.
2.Then navigate to LAYOUT.



3. Click on Add A Gadget.


4. Under the Basic Menu Choose Label, don't forget to Save.


5. After adding a label widget navigate to Template then click Edit HTML.
"Do not click on Expand Widget Templates" just let it unchecked!

6. Search the below code "Label widget recently added.

<b:section id='labelsmenu' maxwidgets='1'> <b:widget id='Label1' locked='true' title='Labels' type='Label'>


7. Now copy the below code and replace the above code.

<b:section id='labelsmenu' maxwidgets='1'> <b:widget id='Label1' locked='true' title='My Blog Labels' type='Label'> <b:includable id='main'><select class='postform' id='cat' name='cat' onchange='location=this.options[this.selectedIndex].value;' style='font:12px Arial;color:#444;text-transform:normal;border:2px solid #000;padding:1px; margin: 8px 10px 0px; float:right'> <option>Click To Choose 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:includable> </b:widget> </b:section>
 
 
 8. Now save your template and you're done!

Previous
Next Post »

Give Some Credit By Clicking On The Ad.