Cara Memasang Label Cloud Miring

Cara Memasang Label Miring - Siang gan kali ini saya akan share tutorial blog bagaimana membuat label cloud kita bisa miring jika di sebtuh dengan mouse. Pertama kali saya lihat ini saya juga kagum dan jadi penasaran bagaimana membuat akhir nya blogwalking dan akihrnya ketemu juga ternyata cara nya cukup simpel karena tidak menggunakan banyak source kode. oke bagi anda yang penasaran silahkan lihat di bawah ini :

1. Login Blogger.com
2. Buka Menu Template >> Edit HTML
3. Cari script ]]></b:skin>, Jika sudah ketemu copy kode CSS di bawah ini lalu Paste tepat diatas script ]]></b:skin>
4. Simpan Template

/* Custom Labels Cloud widget Catatan Seoku */
.label-size{
margin:0 2px 6px 0;
padding: 3px;
text-transform: uppercase;
border: solid 1px #C6C6C6;
border-radius: 5px;
float:left;
text-decoration:none;
font-size:12px;
color:#666;
}

.label-size:hover {
border:1px solid #6BB5FF;
text-decoration: none;
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
-webkit-transform: rotate(5deg);
-moz-transform: rotate(5deg);
-ms-transform: rotate(5deg);
-o-transform: rotate(5deg);
transform: rotate(5deg);
filter: progid:DXImageTransform.Microsoft.Matrix(
M11=0.9961946980917455, M12=-0.08715574274765817, M21=0.08715574274765817, M22=0.9961946980917455, sizingMethod='auto expand');

}

.label-size a {
text-transform: uppercase;
float:left;
text-decoration: none;
}

5. Lalu Buka Menu Tata Letak >> Tambah Widget >> Pilih Label dan atur seperti gambar di bawah ini.

6. Klik Simpan Kemudian lihat blog anda jeng-jeng. ^.^

Terima kasih anda sudah berkenan mengunjungi blog saya yang jelek ini dan semoga artikel Cara Memasang Label Miring ini bermanfaat. ^.^

Tweet

Subscribe to receive free email updates: