Blogger Releases the new version of the Label Widget

8/26 11:58:00 AM Wednesday, August 26 , ,

Blogger,as a part of its 10th Birthday celebrations, has now released a new version of the label gadget.This one is much better that the old version

What is new?

  1. It comes with a Label Cloud.
  2. It lets you choose which labels are to be displayed.
  3. You can customize it further using CSS.

Drawbacks

  1. The cloud just has 5 variations.All labels will be divided into 5 classes depending on the usage of these labels.
  2. It would have been better if there was a bigger number of classes.

How to Customize?

You can customize the looks further by using CSS..As i said it has 5 classes of clouds..You can add CSS styles to each of them.

Here is a sample Style which will give a bluish look for the cloud..Here i have applied styles for all 5 label classes and their hover styles (so 10 style definitions in total).

.label-size-5 a {color: #2789ce; /*color of a label of class 5*/
font-size: 3em;
text-decoration: none;
   }
.label-size-5 a:hover {color: #2789ce; /*color of a label of class 5 on hover*/
text-decoration: underline;
   }
.label-size-4 a {color: #2789ce;/*color of a label of class 4*/
font-size: 2.5em;
text-decoration: none;
   }
.label-size-4 a:hover {color: #2789ce;/*color of a label of class 4 on hover*/
text-decoration: underline;
   }
.label-size-3 a {color: #2789ce;/*color of a label of class 3*/
font-size: 2em;
text-decoration: none;
   }
.label-size-3 a:hover {color: #2789ce; /*color of a label of class 3 on hover*/
text-decoration: underline;
   }
.label-size-2 a {color: #2789ce;/*color of a label of class 2*/
font-size: 1.5em;
text-decoration: none;
   }
.label-size-2 a:hover {color: #2789ce; /*color of a label of class 2 on hover*/
text-decoration: underline;
   }
.label-size-1 a {color: #2789ce;/*color of a label of class 1*/
font-size: 1em;
text-decoration: none;
   }
.label-size-1 a:hover {color: #2789ce; /*color of a label of class 1 on hover*/
text-decoration: underline;
   }

Here all of these CSS styles are customizable.You can change the colours and font sizes of each of the 5 classes.

color: #2789ce; is responsible for the colouring of each of the classes.You can change it appropriately with some other hex colour code or something like color:red;

You can adjust the font size of these 5 classes by adjusting the corresponding font-size: attribute of that label size class.. (em is a unit of font size just like px)

I have commented the css codes(10 comments)..You can remove those comments if you want(eg: /*color of a label of class 2 on hover*/ is a comment)

These CSS style definitions should be placed above
]]></b:skin>

If you are not impressed by the customizability of this blogger label cloud,try this advanced version of the cloud which is highly customizable Label Cloud Widget For Blogger

36 comments :

  1. ArpitAugust 26 at 12:43 PM

    Wow! blogger is getting better day by day.But i prefer the other cloud which has more options.I hope that blogger will improve this gadget with more variations.

  2. UnknownAugust 26 at 1:22 PM

    better to late as never

  3. AlokAugust 26 at 2:31 PM

    they could have added the drop n drag fuctionality

  4. z-vetAugust 26 at 4:58 PM

    Although it's nice to see Blogger finally implementing this functionality, i think they are way too late. Whoever wanted it in their blogs already have Label Cloud Widget installed and configured, so why bother switching now?

  5. Liv von Liv For SweetsAugust 27 at 8:41 PM

    Hi, can you please help me?
    I don't want the links to be underlined. How can I change that?

    Greetz Liv

  6. UnknownAugust 28 at 1:54 PM

    if you added the above css code,then the underlining must have disappeared for the links.. however when you hover the mouse over the link,the underline would appear.To remove that change all the

    text-decoration:underline;
    in the css code to
    text-decoration:none;

  7. Kurs RupiahAugust 29 at 11:10 AM

    cool..blogger is always update widget
    btw I have code widget for ex
    change rate for forex widget , especially for IDR to dollar

  8. bilalSeptember 1 at 2:44 PM

    hi

  9. Mx AxromSeptember 6 at 8:23 PM

    Thanx to blogger...
    You is great of social site...

  10. aleSeptember 13 at 8:40 PM

    good

  11. jhonson blogSeptember 15 at 5:15 PM

    nice ...

  12. sirvanSeptember 16 at 5:16 PM

    I've been looking forward to this style. Thanks for sharing.

  13. dr riefSeptember 18 at 10:10 PM

    congratulation for 10'th birthday anniversary thank' for all, please help me for how to copy in my harddisk

  14. pamungkazOctober 12 at 8:55 PM

    thanks blogger...

  15. leylaOctober 21 at 7:33 AM

    Can I install this if I have a custom template? My template is all HTML.

  16. AnonymousDecember 18 at 8:16 PM

    thx for sharing bro.. ^-^

  17. adminDecember 31 at 6:38 AM

    i have blogger blog, but do admire the clouds od wordpress. they r just awesome. blogger got some work to do.
    why is it that flash clouds can´t work on blogger blog?

  18. adminDecember 31 at 6:39 AM

    and oh .. thank u bhai. great info

  19. astaga lifestyle on the netFebruary 3 at 1:13 PM

    Thanks for sharing.

  20. Kang GabrutFebruary 7 at 10:30 PM

    great tutorial

  21. AbhishekMarch 12 at 3:24 PM

    i have tried to do this ... but when i save it... Again all labels come , not the selected one...
    please help me....

  22. Junks BloggerApril 3 at 10:52 AM

    nice tips..

  23. KarenApril 7 at 2:07 AM

    I've got the same problem as Abhishek. I choose which labels I want to show and save it, but then it shows all of them anyway. I've tried this many times with more than one of my blogs and it just ignores the options I select. Any insight on this?

  24. ManagerApril 14 at 1:53 AM

    Thank you very much

  25. GusztávMay 14 at 6:08 AM

    First of all thanks for all the ideas and tips.

    My question is if it's true that the labels at Blogger won't be considered for SEO? If yes, how can it be changed?

  26. AnonymousMay 22 at 6:51 PM

    thnks !

  27. AnonymousMay 23 at 6:27 AM

    now with animated

  28. seooutsourcingindiaJune 13 at 1:24 AM

    Nice Job Great - SEO Outsourcing India

  29. UnknownDecember 17 at 9:57 PM

    i can see only one tag ...:|

  30. noisyDecember 20 at 12:00 AM

    In my opinion much better widget is Label Sphere, you can see how it looks like on my blog

  31. adeshJanuary 1 at 9:54 PM

    this is such a great site..the simplicity and dealing of various topics is very nice..happy new year and great going..!!
    i will apply this method on my blog.

  32. rdharmaFebruary 2 at 5:23 PM

    Thanks for good tutorial on label cloud widget.

  33. Sadhana PadmanabhanFebruary 5 at 10:55 PM

    Thanks for good tutorials

  34. NeerajApril 5 at 10:52 PM

    this is really really really suburb widget..............

  35. AnonymousDecember 17 at 3:30 PM

    It doesnt work my cloud link is still tiny :L

  36. FreshersNationApril 12 at 6:49 PM

    how to get the labels like you ?
    please reply