Postingan kali ini saya akan membahas tentang cara membuat label yang keren. Judulnya saja keren, pasti nanti tampilannya juga pasti keren, hehehe. Nah cara ini sebenarnya sudah populer dan banyak digunakan bagi pengguna blogger. Oke langsung saja saya kasih tau. Ikuti langkah-langkah dibawah ini ya.
1. Login dulu ke blog anda (blogger.com)
Setelah login akan tampilan seperti gambar dibawah ini :
2. Kemudian pilih Template, kemudian Edit Html.
Bisa dilihat caranya di gambar dibawah ini
3. Kemudian cari kode /b:skin untuk mempermudahkan maka menggunakan Ctrl+F
setelah kode tersebut ketemu maka pastekan kode dibawah ini tepat diatas di kode /b:skin
/*-----Labels Cloud Styled widget by adywibowo97.blogspot.com----*/ .label-size{ margin:0 6px 10px 0; padding: 7px; text-transform: uppercase; border: solid 1px Blue; border-radius: 3px; float:left; text-decoration:none; font-size:10px; color:black; } .label-size:hover { border:1px solid black; text-decoration: none; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; -webkit-transition: all 0.5s ease-out; -ms-transition: all 0.5s ease-out; transition: all 0.5s ease-out; -moz-transform: rotate(7deg); -o-transform: rotate(7deg); -webkit-transform: rotate(7deg); -ms-transform: rotate(7deg); transform: rotate(7deg); filter: progid:DXImageTransform.Microsoft.Matrix( M11=0.9961946980917455, M12=-0.08715574274765817, M21=0.08715574274765817, M22=0.9961946980917455, sizingMethod='auto expand'); zoom: 1; } .label-size a { text-transform: uppercase; float:left; text-decoration: none; } .label-size a:hover { text-decoration: none; }
4. Kemudian simpan template.
5. Langkah selanjutnya pilih Tata Letak -> tambahkan gadget -> pilih label
6. Edit saja seperti gambar dibawah ini
7. Kemudian save, lalu refres blog anda pasti tampilannya seperti gambar dibawah ini
8. Selesai
Semoga trick ini bermanfaat bagi kalian semua, terima kasih.
No comments:
Post a Comment