Cara Buat ‘Label Blog’ Responsive

by -810 Views
Cara Buat ‘Label Blog’ Responsive. Label Blog adalah kumpulan berbagai informasi konten blog yang digabung menjadi group sesuai dengan kategori tertentu.

Tampilan bawaan blogger untuk “Label Blog”, memang standar dan tidak menarik untuk dilihat oleh para surfing netter profesional.

Untuk itu Redsobek memberikan tips yang menarik, agar tampilan Label atau Kategori blog anda menjadi terlihat keren dan responsive tentunya.

Label Blog terlihat menarik dan keren juga ditentukan oleh template bawaan blogger atau template premium yang responsive.

Label


Tampilan Label yang akan kita buat hari ini, demo nya mungkin seperti gambar diatas.

Dengan Melihat Label Blog anda terlihat menarik dan rapi, maka para pengunjung betah berdiam diri membaca artikel-artikel anda.

Label atau bisa dikategorikan dalam sebuah postingan yang memiliki tag dalam konten-konten tertentu bisa diubah dengan modifikasi menarik.


CARANYA:


Apakah tata letak blog anda, sudah terpasang Widget Label?
 
Apabila belum ada Widget Label maka lakukan langkah berikut ;
 
1. Di menu Tata Letak Dashboard Blog anda pilih Tambahkan Gadget, lalu
 
2. Pilih Label dan tampil seperti gambar dibawah ini
 
Label Cloud

3. Selanjutnya pada menu dashboard blog, klik “Tema“.

4. Klik “Edit HTML“.

Dashboard Blog
 

 

5. Cari Kode ]]></b:skin>

6. Copy salah satu kode dibawah ini, kemudian paste tepat diatas kode 
    ]]></b:skin>
 
/* Widget Label Keren */ .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 { border-radius:30px; background:#076BB8; 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 { border-radius:30px; background:#333333; } .label-count { white-space:nowrap; border-radius:30px; padding-right:3px; margin-left:-3px; background:#333333; color:#fff !important; } .label-size { line-height:1.2 }
Lihat hasilnya seperti tampak pada gambar dibawah ini;
 
Label Blogger

 

– background:#076BB8, adalah warna backgroud nama label
– background:#333333, adalah warna background jumlah artikel label
 
7. Simpan TEMA atau template anda, dan lihat hasilnya.


“Label Blog” akan terlihat menarik versi Redsobek. Cara kami ini adalah salah satu modifikasi blog yang kreatif dan banyak dipakai oleh para pemula blogger. Jadi tidak ada salahnya anda mencoba.
.
Tips Cara Buat ‘Label Blog’ Responsive ini semoga berhasil!
.
.

One thought on “Cara Buat ‘Label Blog’ Responsive

  1. Wih mantab dicoba nih, sudah muter2 digoogle tidak faham sekarang jadi paham 🙂 mantab sekali, salam dapat salam dari nganjuk 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *