Aug 10, 2013

How To Create Dropdown Labels For Blogger

on
the tech trackers

Blogger provide default Labels widget which can either be set into cloud style or list style. But if you have written a large number of posts then the Labels will become a great problem for your by occupying a large space of your Blog's sidebar. To save your Blog from this situation you ca install a Dropdown Style Labels Widget which occupies very small space of your Blog and also improves the loading time of your Blog. Let's see now

Note: Before applying this trick you must have pre-installed Labels Widget in your Blog.


How To Apply 


■ Open your Blog Dashboard
■ Open Template → Html Editor

Now Find (Pressing Ctrl+F)

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

Now add below given code replacing it.

Widget Code

<b:widget id='Label1' locked='false' title='Categories' 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 a Category</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>

■ You can Change the name ' Click To Choose category '
■ Remove the code ' (<data:label.count/>, if you don't want to show number of posts in  labels.

Now hit the Save button and you are done.

No comments: