Scroll Bar Widget For BloggerHow to create Scroll Label in Blogger (Blogspot.com)? The label is a function provided by blog service providers to classify our writing in several categories, for which we write writing can be more easily found by search engines in the search index on the category of writing that we write, to be more easily known to be our writing categories.
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: check out the
demo.
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 into a label that has been my friend made.
<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 pal replace with a higher number if you want to display the menu label is higher. Thank you.
