Ads

Scroll function on the labels

Labels or categories are the menus to mark a post, the longer the age of blogs, the more labels that are used and the length will automatically increase. One way to overcome the long labels which is to make the scroll function on the labels. To make it please see the following ways:
*. Log in to Blogger.com.
*. Click the Layout Menu and then click Edit HTML Menu, don't forget to download the Template for a back-up data if an error occurred while editing the template.
*. Tick the Little Box next to "Expand Widget Templates"
*. Find the code like below:

id='Label1' <b:widget locked='false' title='Table Of Contents' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<ul>

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


Next add the following code:

<div style='overflow: auto;width:
160px;
height:
300px;
text-align:left;'></div<


So the result will be as below:

id='Label1' <b:widget locked='false' title='Table Of Contents' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<div style='overflow: auto;width:
160px;
height:
300px;
text-align:left;'>

<ul>

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

</div>


Change the value of width:
160px;
dan height:
300px;
as needed.

*. Click the Preview button and when done click the Save Template Button.
*. Finish.