bikin label warna warni

kali ini kang yono akan memberikan postingan bagaimana sih cara bikin label warna warni seperti di blog kang yono ini. 

silahkan sobat bisa dilihat tutorial dibawah ini :

1. Masuk Dashboard Blogger
2.Tambahkan Label pada blog dengan masuk ke tata letak -> tambahkan widget -> labels
3. Langkah selanjutkan simpan kode HTML pada template, template -> edit template dan letakkan di atas kode ]]></b:skin> atau </style> kode seperti dibawah ini :

/* cloudlabel pelangi*/

.label-size {

line-height: 1.1;

}

.label-size a, .label-size span {

display: inline-block;

color: #fff !important;

padding: 4px 5px;

text-transform: uppercase;

}

.label-size-1, .label-size-2, .label-size-3, .label-size-4, .label-size-5 {

font-size: 100%;

opacity: 5;

}

.label-size a, .label-size span {

display: inline-block;

color: #fff !important;

padding: 4px 5px;

text-transform: uppercase;

}

.label-size-1 a {

background: rgba(155, 89, 182,1.0);

border-bottom: 1px solid rgba(142, 68, 173,1.0);

}

.label-size-2 a {

background: rgba(46, 204, 113,1.0);

border-bottom: 1px solid rgba(39, 174, 96,1.0);

}

.label-size-3 a {

background: rgba(52, 152, 219,1.0);

border-bottom: 1px solid rgba(41, 128, 185,1.0);

}

.label-size-4 a {

background: rgba(26, 188, 156,1.0);

border-bottom: 1px solid rgba(22, 160, 133,1.0);

}

.label-size-5 a {

background: rgba(231, 76, 60,1.0);

border-bottom: 1px solid rgba(192, 57, 43,1.0);

}

.label-size a:hover{

background:rgba(225, 225, 225,0.5);

}

/* cloudlabel */

.label-size-1,.label-size-2,.label-size-3,.label-size-4,.label-size-5 {font-size:100%;filter:alpha(100);opacity:10}

.cloud-label-widget-content{text-align:left}

.label-size {background:#E73037;display:block;float:left;margin:0 3px 3px 0;color:#ffffff;font-size:11px;text-transform:uppercase;}

.label-size a,.label-size span{display:inline-block;color:#ffffff !important;padding:6px 8px;font-weight:bold;}

.label-size:hover {background:#333333;}

.label-count {white-space:nowrap;padding-right:3px;margin-left:-3px;background:#333333;color:#fff !important;}

.label-size {line-height:1.2}


4. klik simpan.

udah jadi deh kayak tampilan di blog ini. selamat mencoba