Cara Membuat Label Warna-Warni Pada Blog

Sahabat Blog Syeftiandro pernah kah kalian melihat sebuah blog yang memiliki label warna-warni seperti pelangi. Apakah ada ingin mencoba menerapkan nya pada blog anda?. Saya akan emberika tutorial bagaimana cara membuat label yang berwarna warni.

Berikut penampakan gambar nya :

Silakan ikuti cara berikut ini :

(Langkah Pertama) :
1.  Masuk ke Dashboard blogger
2   Pilih Menu Tata Letak dan tambahkan Gagget

3.  Pilih Widget Label dengan Mengklik tombel plus (+)

4.  Tambahkan label, jika sudah memasangnya beri ceklis di cloud pada display label

5.  Terakhir Klik Simpan.

(Cara Kedua) :
1.  Pilih Menu Template lalu klik/pilih Edit HTML
2.  Tekan Ctrl + F
3.  Cari kode ]]></b:skin> atau </style>
4.   Letakan kode di bawah ini tepat diatas kode ]]></b:skin>



/* 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);
}

5.  Simpan Template

Jangan lupa coment ya
 

== Semoga Bermanfaat ==

 == Terima Kasih ==