FREE BLOGGER TRICKS

Sign Up To The Free Email Newsletter!

Want to get notified whenever we produce the latest content ? Then subscribe now to start receiving hot updates from today.

Wednesday, 2 September 2015

How To Create Drop Down Label Widget For Blogger

On : 9/02/2015
In :
This is also great tip those who are looking for
drop-down label menu.If your blog don't have 
much space or want to reduce home page 
size, this will help to you.So this drop-down
menu display your post categories,and labels
are link with them.So, each category post are
counting too.you can adjust size of the  
drop-down. follow these steps to add it to your
blog.


1. Log in to blogger account and Go to Design >> Edit HTML
2. Make sure you don't put check mark in  Expand Widget Templates

3. Find below code by using Ctrl+F   

<b:widget id='Label1' locked='false' title='Labels' type='Label'/>
4. Now replace above line (where you found) with below 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>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 wdth of drop-down by chaning   100% 
*You can change   Choose a Category  as your like, if you want.
*If you want to hide the post counter so delete this code.  (<data:label.count/>)

5. Save your Template you are done.

0 comments:

Post a Comment