Cara Membuat Widget Label Blog Unik dan Keren

Cara Membuat Widget Label Blog Unik dan Keren | Sobat pasti pernah melihat pada beberapa template terdapat Label Blog Unik dan Keren, yang berbeda dengan label default blogger. Kali ini WebKeren akan membahas cara modifikasi widget label menjadi unik karena lebih keren dan rapih.

Kalau sobat belum pernah melihatnya, berikut penampilannya.
Cara Membuat Label Blog Unik dan Keren

Jika sobat menggunakan template bawaan blogger ataupun template custom namun dengan penampilan label yang biasa-biasa aja, sobat bisa menambahkan CSS berikut ini dengan mudah, gampang, dan cepat yang membuat Label Blog menjadi Unik dan Keren.
Fungsi / Kelebihan Menambahkan Widget Label yang menarik ini adalah menjadikan Widget label lebih enak dilihat dan menarik perhatian pengunjung.
Sebelum Membuat Widget Label Blog Unik dan Keren, sobat harus melakukan hal berikut:
  1. Memasukkan artikel blog ke dalam kategori-kategori label (Baca Cara Membuat Label Kategori Blog)
  2. Memasang widget label (Baca Cara Menambahkan Widget Label Blog). 

Setelah kedua hal tersebut dilakukan, barulah sobat bisa melanjutkan ke langkah berikut.

Cara Merubah Tampilan Widget Label Blog Unik&Keren

Kalau sobat sudah menambahkan widget label, sekarang kita akan membuatnya menjadi unik dan Keren. Caranya:
  1. Masuk ke editor template. caranya: Dashboard Blogger > Template > pilih EDIT HTML.
  2. Cari  kode ]]></b:skin> atau </style>. Agar mudah, gunakan ctrl+f (klik dulu didalam box template editor).
  3. Paste kode css berikut ini diatas kode ]]></b:skin> atau </style> (kemungkinan besar pada template obat sudah ada css label, cari .label dan paste / ganti dengan kode ini)
  4. /* label http://webkeren.net */
    .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:#4169E1; 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 }
    Sobat bisa merubah warna-warna dalam widget label tersebut sesuai keinginan.
  5. Simpan template, kemudian lihat hasilnya.

Demikian Tutorial WebKeren mengenai Cara Membuat Widget Label Blog Unik dan Keren. Silakan tulis di kolom komentar kalau sobat punya pendapat, mau berbagi cerita keberhasilan ataupun kegagalan menerapkan, menanyakan sesuatu, ataupun sekedar berbagi unek-unek. Selain itu, Jangan sungkan berbagi artikel ini dengan tombol share di bawah, GRAtis lho!. Semoga bemanfaat untuk kita semua.
referensi:
mas-sugeng.com

Follow Twitter, Facebook, G+ untuk mendapat update Artikel Keren Terbaik Terbaru. Atau Subscribe untuk menerima artikel terbaru gratis di Inbox email Sobat: