Modifikasi Label Blogger Keren (3 Style)

Modifikasi Label Blogger Keren (3 Style) - Assalamu'alaikum teman blogger? usang tidak posting wacana blog, dan sekarang aku akan membahas wacana Modifikasi Label Blogger Keren. Label yaitu sebuah fitur gadget dari blogger yang menampilkan tag atau kategori yang ada di blog kita. Ludang kecepeh bagusnya jikalau kita memodifikasi widget label tersebut menjadi ludang kecepeh indah dan menarik. Disini aku akan membagikan tiga macam tampilan label blogger, Sobat bisa pilih sesuai impian sobat!

 dan sekarang aku akan membahas wacana Modifikasi Label Blogger Keren Modifikasi Label Blogger Keren (3 Style)
Modifikasi Label Blogger

Modifikasi Label Blogger Keren (3 Style) :

1. Pertama-tama, Login ke Account Blogger sobat.
2. Jika teman belum menambahkan widget label, silahkan klik Layout ? Add Gadget ? Labels, kemudian pilih yang Cloud, kemudian Save.


3. Sekarang, masuk ke Template ? Edit HTML.
4. Copy Kode CSS dibawah ini sempurna diatas arahan ]]></b:skin>.
  • KODE CSS
Style 1
/* -- Label Modification by -- */
.label-size a{padding-left:10px;background:#0090d5;padding:0 10px;color:#fff!important;height:28px;line-height:26px;text-decoration:none;border:none!important;-webkit-transition:all .3s ease-in-out!important;t:30pxt:30px;float:left;margin-left:3px;margin-top:3px;font-size:14px;font-family:Arial,sans-serif}
.label-size a:hover{background:#555;box-shadow:1px 1px 2px 2px rgba(0,0,0,0.5);-o-transition:all .3s;-moz-transition:all .3s;-webkit-transition:all .3s;-moz-transform:scale(1.1);-o-transform:scale(1.1);-webkit-transform:scale(1.1);transition:all .5s;-moz-transition:all .5s;-webkit-transition:all .5s;-o-transition:all .5s;-webkit-border-radius:1px;border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px}
Style 2
/* -- Label Modification by -- */
.cloud-label-widget-content {text-align:center;font-weight: bold;padding: 4px 0}
.cloud-label-widget-content span {display: inline-table; line-height: 1.2;}
.cloud-label-widget-content span a {padding:3px 4px;color:#fff}
.label-size {margin:3px}
.label-size span {background:#E95D0C;padding:3px 4px;color:#fff}
.label-size-1 a {background:#0090d5;font-size:13px;}
.label-size-2 a {background:#E20000;font-size:13px;}
.label-size-3 a {background:#00CEAC;font-size:13px;}
.label-size-4 a {background:#CEEA00;font-size:13px;}
.label-size-5 a {background:#EA9C00;font-size:13px;}
.cloud-label-widget-content span a:hover {background:#555;}
Style 3
/* -- Label Modification by -- */
.label-size a{padding-left:10px;padding:0 10px;color:#fff!important;height:28px;line-height:26px;text-decoration:none;border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;background:#B8B8B8;border:0;border-radius:3px;color:#fff;t:30pxt:30px;float:left;margin-left:3px;margin-top:3px;font-size:14px;font-family:Arial,sans-serif;}
.label-size a:hover{background:#9B9B9B;font-weight: bold; font-variant: small-caps;}
.label-size span{float:right;font-size:9px;margin:0 0 4px;}
5. Setelah itu, klik Save Template. dan lihat hasilnya.

Sangat memperringan dan sepele bukan untuk Modifikasi Label Blogger?
Nah, dengan cara ini maka kita telah mempercantik tampilan label blog kita..

Semoga memberi manfaat!

Belum ada Komentar untuk "Modifikasi Label Blogger Keren (3 Style)"

Posting Komentar

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel