Showing posts with label Efek. Show all posts
Showing posts with label Efek. Show all posts

Monday, May 9, 2011

Cara buat Avatar miring (rotate) pada bagian comment



Akhirnya saya online juga, saya akan membahas tentang gambar koment miring. Untuk membuat image avatar pada bahagian comment blog menjadi miring(rotate) seperti yang anda lihat pada gambar diatas ataupun contoh pada bagian comment blog ini, hanya ikuti beberapa langkah yang mudah di bawah.

Langkah 1

Log in blog => Dashboard => Design => Edit HTML.

Langkah 2

Dengan menggunakan keyboard, tekan F3 ataupun Ctrl+F, ketik atau paste kod ]]></b:skin> pada ruang Find dan seterusnya tekan Enter.

Langkah 3

Salin kode di bawah dan paste kode tersebut atau diatas kod ]]></b:skin> pada script template (lihat  langkah 2)

.avatar-image-container img {
-webkit-transform: rotate(355deg);
-moz-transform: rotate(355deg);
}
Contoh:
 .avatar-image-container img {
-webkit-transform: rotate(355deg);
-moz-transform: rotate(355deg);
}
]]></b:skin>
terakhir, klik Preview. Jika tiada peringatan error, klik Save

Cara Membuat efek bayang-bayang pada gambar

google indonesia

Untuk membuat efek bayang-bayang pada bagian kanan dan bawah gambar seperti yang Anda dapat lihat pada gambar di atas, hanya perlu mengikuti beberapa langkah di bawah ini:

pesan: Silahkan save dulu script template Anda sebelum melakukan editting.

Langkah 1

Login blog => Dashboard => Layout => Edit HTML. Selanjutnya centang Expand Widget Templates

Langkah 2

Tekan Ctrl + F dan ketik kode .Post img { dan seterusnya tekan enter.

Langkah 3

Salin kode di bawah dan pastekan di bawah kode .Post img { (lihat langkah 2)

background: url(http://i30.tinypic.com/1qsh1h.jpg) no-repeat right bottom;
padding: 5px 10px 10px 5px;
border: 0px;

Contoh:

.post img {
background: url(http://i30.tinypic.com/1qsh1h.jpg) no-repeat right bottom;
padding: 5px 10px 10px 5px;
border: 0px;