Saturday 29 October 2011

How Make Drop Down Label Menu In Blogger

If you don't understand what  drop down label menu means, then check on right column of my blog. You should be able to see "browse by categories" just below popular post gadget.  For those who have lots of labels and little space, this trick could be very helpful.



Here is how you can add for on your blog.
Step 1: You will first have to add Labels gadget. To do so, go to Design>Page elements.
             Then click on 'Add a Gadget' and select and add Labels gadget.

Step 2: Click on Edit html. Check the expand widget template check box and press crtl+f to find following       code.

<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<data:label.name/>
<b:else/>
<a expr:href='data:label.url'><data:label.name/></a>
</b:if>
(<data:label.count/>)
</li>
</b:loop>
</ul>



I am quite sure that you will have difficulties finding the entire above code. If so then just find
<b:loop values='data:labels' var='label'>
After finding this, you should be able to select the code in the box above manually. Select the codes exactly as shown in the box as we are going to replace the selected code.

Step 3: Replace the selected code in step 2 with the following code

<select onchange='location=this.options[this.selectedIndex].value;' style='width:100%'>

<option>Browse By categories</option>
<b:loop values='data:labels' var='label'>
<option expr:value='data:label.url'><data:label.name/>
(<data:label.count/>)
</option>
</b:loop>
</select>
You may replace the text ' Browse By categories' with your desired line

Step 4: Save the template. If you want to re position it, you may do so by going to layout> page elements.

Click here for more blogger tricks.

No comments:

Post a Comment