Fortunately you can prevent that from happening by converting the widget into a a dropdown (or is it a pulldown?) menu. Your labels widget will be reduced to just one line! And it only expands into a full list when you click it.
Before applying this hack, you must already have a Labels widget installed. If you don’t have one, go to Layout (old UI: Design > Page Elements) and add it.
Now let’s make the dropdown:
- Go to Template > Edit HTML > Proceed (old UI: Dashboard > Design > Edit HTML).
- Back up your template.
- Make sure you DO NOT check the Expand Widget Templates checkbox.
- Look for the following lines in your HTML code:
<b:widget id='Label1' locked='false' title='Labels' type='Label'/>
- Replace that line with this code:
<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'> <select style='width:100%' onchange='location=this.options[this.selectedIndex].value;'> <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:include name='quickedit'/> </div> </b:includable> </b:widget>
- Change the width of the dropdown menu bay changing 100% to any percentage, or pixel (px).
- You can change “Click to choose a label” phrase in line 8 to your preferred phrase.
- Code line 11 is for post count, if you do not want to show post count at the end of each label, delete this line.
- Preview before saving.
- Congratulations you have shrunk your labels widget and created more space.
- Enjoy!
Create Dropdown menu for Labels widget
Reviewed by Black
on
3:04 AM
Rating:
No comments: