Add Different

Labels are known as blog categories. Labels are linked pages that show several related blog posts. For example let’s say you running a blog and you are posting about “how to add labels in blogger” and you are sorting it with two labels such as tricks and blogger. Now you are posting another topic about “how to add labels in wordpress” and you are sorting it with tricks and wordpress. So if your visitors want to learn more about tricks they will use the label tricks which contains two posts. A category navigation makes it easy for users to find your articles, and also helps them discover similar titles on your blog. In wordpress we have two options, where we use categories as main topics and tags as micro topics. In Blogger you have only one option that is labels. Managing Labels in Blogger isn't as straightforward as in WordPress, but it is fairly simple. The Blogger Labels Widget can be styled in a variety of ways. Curled, Animated Labels and many more. Now, how about a colorful Labels Widget? This one supports a maximum of 20 labels. You could get this amazing rainbow widget by adding a few steps of CSS.

How To Add Multi colored labels in blogger


Step I: Adding the Labels Widget to Your Blog

From your Blog's Dashboard, navigate to Layout --> Add a Gadget --> and select Labels from the list. Select Sorting by Frequency. Don't forget to select Cloud display. Now Save the Gadget.

Step II: Adding CSS

Now go back to your Blog's Dashboard and navigate to Template and click Edit HTML and then search for the code shown below by pressing Ctrl+F

]]></b:skin>

Now Paste the CSS styles Shown Below just above/before it.

Style:1


.label-size{display:block;float:left;margin:0 3px 3px 0;color:#fff;font:12px verdana;text-transform:uppercase}
.label-size a,.label-size span{display:inline-block;color:#fff!important;padding:6px 8px;text-decoration:none}
.label-count{padding-right:3px;margin-left:-3px;background:#434343;color:#fff!important}
.label-size{line-height:1.2}
.label-size:nth-child(1){background:red}
.label-size:nth-child(2){background:#cf650d}
.label-size:nth-child(3){background:#9e0963}
.label-size:nth-child(4){background:#f54e67}
.label-size:nth-child(5){background:#42ad9d}
.label-size:nth-child(6){background:#b3001b}
.label-size:nth-child(7){background:#5c3e31}
.label-size:nth-child(8){background:#8e4811}
.label-size:nth-child(9){background:#f90}
.label-size:nth-child(10){background:#097054}
.label-size:nth-child(11){background:#6599ff}
.label-size:nth-child(12){background:#461d7c}
.label-size:nth-child(13){background:#666}
.label-size:nth-child(14){background:#0f0}
.label-size:nth-child(15){background:#7c71ad}
.label-size:nth-child(16){background:#1eb6ff}
.label-size:nth-child(17){background:#898c17}
.label-size:nth-child(18){background:#000078}
.label-size:nth-child(19){background:#fc0}
.label-size:nth-child(20){background:#c33}
.label-size:hover{opacity:.6;-webkit-transition:.5s;-moz-transition:.5s;transition:.5s}


Style:2
different color labels

.label-size{display:block;float:left;margin:0 3px 3px 0;color:#fff;font:12px verdana;text-transform:uppercase;border-radius:30px}
.label-size a,.label-size span{display:inline-block;color:#fff!important;padding:6px 8px;text-decoration:none}
.label-count{border-radius:30px;padding-right:3px;margin-left:-3px;background:#434343;color:#fff!important}
.label-size{line-height:1.2}
.label-size:nth-child(1){background:red}
.label-size:nth-child(2){background:#cf650d}
.label-size:nth-child(3){background:#9e0963}
.label-size:nth-child(4){background:#f54e67}
.label-size:nth-child(5){background:#42ad9d}
.label-size:nth-child(6){background:#b3001b}
.label-size:nth-child(7){background:#c33}
.label-size:nth-child(8){background:#8e4811}
.label-size:nth-child(9){background:#f90}
.label-size:nth-child(10){background:#097054}
.label-size:nth-child(11){background:#6599ff}
.label-size:nth-child(12){background:#461d7c}
.label-size:nth-child(13){background:#666}
.label-size:nth-child(14){background:#0f0}
.label-size:nth-child(15){background:#7c71ad}
.label-size:nth-child(16){background:#1eb6ff}
.label-size:nth-child(17){background:#898c17}
.label-size:nth-child(18){background:#000078}
.label-size:nth-child(19){background:#fc0}
.label-size:nth-child(20){background:#c33}
.label-size:hover{opacity:.6;-webkit-transition:.5s;-moz-transition:.5s;transition:.5s}


Style:3
labels for blogger

.label-size{display:block;float:left;margin:0 3px 3px 0;color:#fff;font:12px verdana;text-transform:uppercase;border-radius:30px}
.label-size a,.label-size span{display:inline-block;color:#fff!important;padding:6px 8px;text-decoration:none}
.label-count{border-radius:30px;padding-right:3px;margin-left:-3px;background:#434343;color:#fff!important}
.label-size{line-height:1.2}
.label-size:nth-child(1){background:red}
.label-size:nth-child(2){background:#cf650d}
.label-size:nth-child(3){background:#9e0963}
.label-size:nth-child(4){background:#f54e67}
.label-size:nth-child(5){background:#42ad9d}
.label-size:nth-child(6){background:#b3001b}
.label-size:nth-child(7){background:#c33}
.label-size:nth-child(8){background:#8e4811}
.label-size:nth-child(9){background:#f90}
.label-size:nth-child(10){background:#097054}
.label-size:nth-child(11){background:#6599ff}
.label-size:nth-child(12){background:#461d7c}
.label-size:nth-child(13){background:#666}
.label-size:nth-child(14){background:#0f0}
.label-size:nth-child(15){background:#7c71ad}
.label-size:nth-child(16){background:#1eb6ff}
.label-size:nth-child(17){background:#898c17}
.label-size:nth-child(18){background:#000078}
.label-size:nth-child(19){background:#fc0}
.label-size:nth-child(20){background:#c33}
.label-size:hover{opacity:.6;-webkit-transition:.5s;-moz-transition:.5s;transition:.5s}


Now save your template