Show Top Labels Only In Labels Widget. ~ The Blog Doctor.
Loading...

Show Top Labels Only In Labels Widget.

New Visitor? Like what you read? Then please subscribe to my Blog Feed or sign up for Free Email Updates. Thanks for Visiting!

As you write more and more posts you will keep adding labels to them to categorize your posts. You can add more than one label to any single post. Labels are useful as they serve as keywords channelling traffic to your posts through search engines like Technorati.



However the list of labels in your blog can get to be very long stretching your sidebar until your blog post looks like a flag on top of a long sidebar. To prevent this you can modify the code of your Labels widget to show only the topmost labels in your blog..............


LIMIT LABEL NUMBER


To limit the number of labels shown in your Labels sidebar widget login at Blogger.com and click 'Layout' link on Dashboard. The Page Elements subtab of Template tab will open. If you do not have a Labels widget in the sidebar Add a Labels Page Element to it.



After the Labels widget is added click on Edit Html subtab of Template tab. This will open the Template code box on the Edit Html subtab. Click the Expand Widgets Template checkbox on top of the Template code box to put a check mark in it. The Template code box will show the expanded widgets templates.



Scroll down in the Template code box to locate the code for the Labels widget. This will look like this :

<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'>
<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>
<span dir='ltr'>(<data:label.count/>)</span>
</li>
</b:loop>
</ul>

<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>


REPLACE THE WHOLE ABOVE CODE WITH THE CODE BELOW :


<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>
<ul>
<script type='text/javascript'>
var labelnum = 0;
<b:loop values='data:labels' var='label'>
if (<data:label.count/> &gt; 2) {
document.write(&quot;<li><a expr:href='data:label.url + "?max-results=100"'
rel='nofollow'><span><data:label.name/></span></a>(<data:label.count/>)</li>&quot;);
}
</b:loop>
</script>
</ul>
<b:include name='quickedit'/>
</b:includable>
</b:widget>



The code above will only show labels with more than two posts. To increase number of labels increase the number two in this code :

if (<data:label.count/> &gt; 2) {



Preview. Save Template. Clear Cache. View Blog.



In the screenshot at right you can see two label widgets. The Modified Labels widget at the top shows only the top two most frequently applied labels. The Normal Labels widget at the bottom shows all the labels in the blog. If you have such a widget and lots of labels it can get terribly long making your blog stand on it's long sidebar!!









LIMIT NUMBER OF POSTS SHOWN FOR LABELS


When a label is clicked in the sidebar the default number of posts loaded is 20. You can also decrease this number by modifying the code show above. Take a look at these code lines within the above code :

<a expr:href='data:label.url +  "?max-results=100"' rel='nofollow'>


Change '100' in the above line to the number of posts you wish to load. Remember that if you select a higher number the page will take too long to load and you may lose traffic.


Happy Blogging!


33 comments:

Edith OSB said...

When I try this, all the labels disappear. I have many for more than 2 posts. I have tried it twice with no success. My blog is Monastic Musings

Thanks for your many great hints: I appreciate your work a lot.

Vin said...

Edith OSB,

It works for me. Check out the Modified Labels widget and the Normal Labels widget in the center column of this demo blog :

http://blogfirstaid.blogspot.com

As you can see the Modified Labels widget contains only the top two labels while the Normal Labels widget contains ALL the labels.

Queen from Another Planet said...

Hi, I tried this, and all my labels disappera. I have an inordinate amount of labels, so the ideal number for me is labels with 5 or more posts.

I tried replicating exactly what you have here, as well as increasing the number to 05, but either ways, all the labels disappear.

My blog is: http://theshoatstatements.blogspot.com

Vin said...

Queen from Another Planet,

Check the label code again. Increase number starting from 1. Clear cache after each save. Add a separate label widget with the modified code.

Cinnamon Henke said...

Worked great for me! Thanks!

bricknhymr said...

Hey Vin,

Is there a way to set up a list of lables to appear in a widget. I am looking to "subdivide" my labels into different groups.

Is this possible in any way, even to hard code them each into their own lists. I am not sure how I would do that.

-Bricknhymr

Anonymous said...

Hi,
how to make buttons (design) for items like homepage.
I want to put labels like I want but it goes alphabetically. any help.
my web page is:
savihomoeo.blogspot.com
If there is more suggestions to make my webpage more beautiful kindly suggest me.

Vin said...

Anonymous,

Have a look at CSS Navigation in this post :

CSS Navigation bar.

Vin said...

Bricknhymr,

You can add label links in a Html Page element formatted any way you want.

Disc said...

hi...can i add label if i using classic template..if can, please advise...thanks..

Vin said...

Disc,

In Classic Template to add Label Links to sidebar you have to manually add their html. See :

Everything About Labels in Blogger.

Colonel Kernel said...

It works!

Clearing out the cache is essential to solving problems, but I didn't have any, so I didn't bother. It worked the first time.

In searching for this solution I cam across others who had the same desire. Hope you don't mind if I pass this gem along.

Mrs. J. said...

Works beautifully for me.
Thanks!

Me said...

My labels widget has no html tab.
How do I get labels in the collapsible boxes you linked to?I also can not upload a photo to y header not sure why
Thanks Vin

Vin said...

Me,

For the Label collapsible boxes see How to Classify Blogger Labels.

You can try to Add a Background Picture in the Header CSS.

info@gigaproject.net said...

Would be possible to show only the first n labels after having them alphabetically sorted?
Thank you

Vin said...

info@gigaproject.net,

Of what use would it be to the viewer to see this? For example one of the top labels in this blog is 'Template'. If I were to show only first two alphabetically sorted labels, this label would not show on the blog and there would be loss of traffic!!

info@gigaproject.net said...

The interst would be to have also a SECOND label list showing ONLY labels starting with "- " or with "$ ", for example

Vin said...

info@gigaproject.net,

Since only a few label links will be shown in the list why not create it manually by pastig your top alphabetical label links in a Link List Page Element.

V. Louise Feddema, I Am Your Artist said...

This worked like a champ! Thanks. My list was ridiculously long -- I was ready to drop it. This solved the problem.
Louise of IAmYourArtist.com

Liz said...

Thanks so much...this worked like a charm.

But can you reduce the font on your webpage? In Firefox, it looks like it is 36 pt!

Fred said...

Hi Vin,
I would like to categorize my post (eg: Facts, Analysis, Rumors, Opinion). The way I have done it so far, i use labels to categorize the post, however, I have much more than these 4-5 categories for labels (other labels are subject matters, people names, season... things relating to the post).I want the category to appear somewhere around the post titles and I use the label item in blog post widget to achieve that. However, I do not want the other labels to appear within this widget, but only the category (one per post). How can I achieve that without getting rid of all labels that are not my main categories (i want to keep them for search engine)? I hope you understand what I am talking about...
Thanks in advance!

Vin said...

Fred,

At the bottom of every post add a heading "Category" and then add your label-link. Then Publish post.

Uncheck the Labels option in Blog Posts widget and save. (Layout--->Page Elements---->Edit link in Blog Posts gadget)

Fred said...

Hi Vin,
can you be more specific? I don't know how to make a heading in my posts...

Vin said...

Fred,

Open post for editing.
At the bottom type 'Category'.
Highlight the above word using left click an drag with mouse.
Click the Bold icon in tool bar.

After the word 'Category' type in Label name.
Highlight the label name usig mouse.
Click Add Link icon in toolbar.
In popup window type in this link :

http://MYBLOG.blogspot.com/search/label/LABEL_NAME

Replace the CAPS in above link with actuals of your blog.
OK it.
Publish Post.

Vin said...

Fred,

Open post for editing.
At the bottom type 'Category'.
Highlight the above word using left click an drag with mouse.
Click the Bold icon in tool bar.

After the word 'Category' type in Label name.
Highlight the label name usig mouse.
Click Add Link icon in toolbar.
In popup window type in this link :

http://MYBLOG.blogspot.com/search/label/LABEL_NAME

Replace the CAPS in above link with actuals of your blog.
OK it.
Publish Post.

Fred said...

Ok, I see what you mean. I didn't expect something as simple as this! ahah! It's an option but I actually want the category to appear just beside the author and timestamp (which lie just under the post title), not in the post text. I understand it might be a bit complicated so don't bother with this if you don't feel like it! Really appreciate your help! Keep it up! Thank you!

Fred said...

When I uncheck the Labels option in Blog Posts widget, they don't disappear from my blog!?!? How come?

Vin said...

Fred,

Did you clear cache after saving changes?

Fred said...

Yup, cleared cache... doesn't change anything! I'm puzzled!

shelf-employed said...

I tried this widget and it works!

Thanks.

Just one note of caution -
If you re-title your "Labels" widget (I tried to rename mine the more common, "Tags"), you will need to change the widget code to reflect the new title.

Bilal Ahmad said...

Hello how can i add a menu bar in my blog.

Vin said...

Bilal Ahmad,

Have a look at How to Add CSS Navigation Tabs to Blog?

CLICK TO LEAVE A COMMENT..... :-)



Skip to top of post.

Search Blog Before Commenting

Loading...

Post a Comment

Please use the above search box to search this blog before posting your valuable comments.

Comments posted on Dummies Guide to Google Blogger (Beta) are moderated and will be approved only if they are on-topic and not abusive. Try not to include website URLs/links in your comments. You can email me : drbhatns at gmail dot com for any blogging question. Thanks,

Vin.

The Blog Doctor The Blog Doctor2 Blog Doctor Home

SUGGESTED READING

Tips On Blogger and Latest News.



Skip to top of post.