Loading...
ucapan

Silahkan Pilih Warna Background Yang Cocok Buat Mata Anda




Tuesday, October 13, 2015

Cara Membuat Couter Box pada Widget Daftar Label

Post Generator PRO
Plugin Wordpress POST GENERATOR PRO sederhana tapi powerful, Membuat ribuan artikel blog hanya dalam sehari saja. Tanpa masalah Duplicate Content.
Rugi jika tidak memilikinya walau belum punya Hosting dan blog wordpress, akibat penjualannya sudah berakhir. Miliki secepatnya... Sangat bagus digunakan untuk mengupgrade BACKLINK ke blog utama demi menghasilkan Duit Or Dollar bagi pemain Adsense, He..
Counter Box pada Widget Label
Cara Membuat Couter Box pada Widget Daftar Label - Halo sobat, seperti biasa kali ini saya akan membagikan sebuah artikel yang mudah-mudahan bermanfaat bagi sobat semua, yaitu bagaimana cara membuat counter box pada widget label, seperti yang kita tahu, widget label yang berada di blog mas DTE :], seperti itulah widget label yang akan kita buat, artikel ini saya dapat dari +Kang Ismet , dan saya sangat berterima kasih pada Kang Ismet yang selalu berbagi artikel yang bermanfaat bagi kita.

OK tidak perlu berbasa-basi lagi, kita langsung saja ketahap bagaimana cara membuat counter box ini pada widget label blog sobat, simak dan praktekan tutorial di bawah ini :

1. Buat Widget dahulu, dan centang Tampilkan jumlah entri per label

2. Masuk ke Template > Edit HTML > masukkan css berikut diatas ]]><b:skin>

#Label1 li a {color: #2c3e50;text-decoration:none;}

#Label1 li a:hover, #Label2 li a:active, #Label1 li a:focus {color: #20aea6;text-decoration:none;}

#Label1 li .label-counter {float:right;background-color:#20aea6;color:#fff;line-height:1;margin:2px 0 0;padding:3px 5px;border-radius:2px;text-align: center;font-size:12px;}

#Label1 li:hover .label-counter {background-color:#255e96;color:white}


Silahkan modifikasi tampilannya sesuai keinginan sobat.

Jika css diatas tadi tidak merubah Widget label sobat, gan ti #Label1 dengan #Label2 atau #Label3 dst.

3. Pada Label terpilih cari kode dibawah ini :

<span dir='ltr'>(<data:label.count/>)</span>


Hapus kode tersebut dan ganti dengan :

<span class='label-counter'><data:label.count/></span>



Pada hasil akhir, apabila jumlah postingan lebih banyak maka akan lebih lebar seperti ini 123 dibanding yang lebih sedikit seperti ini 32. Untuk membuat ukuran yang sama, pada #Label1 li .label-counter tambahkan ukuran fixed :

width:25px
silahkan sesuaikan ukuran pixel sesuai selera sobat.
Sekian Tutorial saya hari ini, terima kasih atas kunjungannya, semoga bermanfaat dan selamat mencoba. Happy Blogging :).

Resource : http://blog.kangismet.net/2013/10/membuat-counter-box-pada-widget-label.html

Title : Cara Membuat Couter Box pada Widget Daftar Label
Description : Cara Membuat Couter Box pada Widget Daftar Label - Halo sobat, seperti biasa kali ini saya akan membagikan sebuah artikel yang mudah-mu...

3 komentar

This comment has been removed by the author.

ane masih belum paham ttg edit label1,label2 itu gimana. yg diedit itu yg bagian mananya aja

Berkomentarlah dengan bijak dan sopan, Dilarang menggunakan Link Aktif, Link Mati, Promo, dll.
Dan Berbagilah Jawaban atas apa kesulitan yang sobat-sobat lainnya dapatkan.
Mohon maaf jika ADA komentar atau pertanyaan tidak bisa cepat saya respon,
DIkarenakan Saya tidak selalu online selama 24 Jam.