Sabtu, 17 Mei 2014

Cara Membuat Label Cloud Menjadi Lebih Rapi dan Keren

Cara Membuat Label Cloud Menjadi Lebih Rapi dan Keren - kali ini saya akan membagikan tutorial yang cukup mudah, yaitu membuat label cloud menjadi lebih rapi dan keren. langsung saja berikut tutorialnya :

thumbnail postingan

Label Cloud

1. pertama masuk ke dashboard > Template > edit HTML
2. kedua, carilah kode ]]></b:skin> (untuk mempermudah gunakan CTRL + F)
3. letakkan kode dibawah ini diatas ]]></b:skin>

/* Label */
.label-size-1,.label-size-2,.label-size-3,.label-size-4,.label-size-5{font-size:100%;opacity:10}
.cloud-label-widget-content{text-align:left;overflow:hidden;margin-top:0px}
.label-size{display:block;float:left;background:#393939;margin:0 1px 1px 0;color:#eee}
.label-size a,.label-size span{display:inline-block;color:#fff!important;padding:6px 8px}
.label-size:hover{background:#DC1E25;transition:all 0.3s ease-in}
.label-count{white-space:nowrap;padding-right:8px;margin-left:-4px}
.label-size{line-height:1.2}
#sekel-column-divide .label-size{background:#555!important}
#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:#e74c3c;color:white;transition:all 0.3s ease-in}

4. Simpan template anda dan lihat hasilnya


mudah bukan, jika dirasa tutorial ini bermanfaat mohon dishare kembali dan tinggalkan komentar ... 

Share this

Diposting Oleh Admin | Pada Sabtu, 17 Mei 2014 | Label Tutorial Blogger
0 Komentar