Scroll Bar for Labels in blog |
How easy and simple installation, just a few clicks, scroll label will appear. Good for those who can not wait, please follow the tutorial below:
1. On the Dashboard page, click the menu design
2. Then click add widget
3. Choose Labels
4. Make sure the labels with the "List"
5. Christened with the name "Category" and click save
6. Now go to Edit HTML.
7. Click the Expand Widgets Templates.
8. Find a buddy label that has been created earlier, with CTRL + F and type in "Category", it would appear that complicated HTML code, but do not bother to see the HTML code.
9. Just look at the text in blue below, that code should be pasted.
<b:widget id='Label1' locked='false' title='Kategori' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div expr:class='"widget-content " + data:display + "-label-widget-content"'>
<div style='overflow:auto; width:ancho; height:250px;'>
<b:if cond='data:display == "list"'>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if cond='data:showFreqNumbers'>
<span dir='ltr'>(<data:label.count/>)</span>
</b:if>
</li>
</b:loop>
</ul>
<b:else/>
<b:loop values='data:labels' var='label'>
<span expr:class='"label-size label-size-" + data:label.cssSize'>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if cond='data:showFreqNumbers'>
<span class='label-count' dir='ltr'>(<data:label.count/>)</span>
</b:if>
</span>
</b:loop>
</b:if>
<b:include name='quickedit'/>
</div>
</div>
</b:includable>
</b:widget>
10. Click save
Each template has a different character, perhaps in your blog that there is a code
<div class='widget-content'>
not like the one on my blog are:
<div expr:class='"widget-content " + data:display + "-label-widget-content"'>
Note: important location of the inserted additional code must be correctly placed.
For code height: 250px is the height of label scrolls, please replace with a higher number if you want to display the menu label is higher.