"spread the knowledge or teach a science, although only one verse"
Breaking News
Loading...
Wednesday, 30 October 2013



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>

 

.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;
}
4. Simpan Template
5. Lalu Buka Menu Tata Letak >> Tambah Widget >> Pilih Label dan atur seperti gambar di bawah ini.


6. Klik Simpan Kemudian lihat blog anda


Sumber : catatanseoku

0 komentar:

Post a Comment