Photo Profile Berbingkai

Pernah melihat photo Profile berbingkai atau berfigura, langkah ini membuat Photo kita nampak  lebih berkesan jika dilihat mata. Cara membuatnya sangat mudah sekali, yaitu hanya merubah nilai border pada stylee sheet CSS pada bagian untuk photo profil. berikut langkah - langkahnya : 

• Sign in
• Klik menu Layout / Tatak Letak
  
• Klik menu Edit HTML
• Klik kotak kecil di samping tulisan Expand Template Widget
• Cari kode yang mirip dengan kode di bawah ini :

.profile-img { float: left; margin: 0 5px 5px 0; padding: 4px; border: 1px solid $bordercolor; }

Ganti nilai border dengan nilai yang lebih besar, contoh 6px, sehingga kodenya akan seperti ini :

.profile-img img { float:left; margin:0 8px 3px 0; padding:4px; border:6px solid $bordercolor; }

klik tombol simpan template

Selesai. disini intinya anda hanya mengganti dengan nilai yang lebih besar.

keterangan :

float:left; : artinya photo akan di simpan di sebelah kiri pada tulisan Profile.

padding:4px; : padding disini maksudnya adalah jarak antara photo dengan figura (border) sebesar 4 pixel, jika sobat tidak menginginkan ada jarak antara photo dengan bingkai, maka tinggal ganti nilainya dengan 0px (nol).

border:1px solid #ddd; : ini yang menjadi bingkai photonya, nilai figura adalah sebesar 1 pixel, jika ingin figuranya tampak lebih lebar, ya tinggal ganti nilai 1px dengan nilai yang lebih besar, contoh 6px, 8px atau yang lainnya.

kode #ddd : adalah kode warna untuk abu-abu, silahkan ganti dengan kode warna lainnya jika tidak cocok, jika kurang paham tentang kode warna silahkan baca disini.

Hasil akan nampak seperti dibawah ini :


Selamat mencoba....

Terimakasih sudah mengunjungi blog ini... :D