Friday, February 4, 2011

Cara Menghilangkan Efek Bayangan Pada Image/Gambar

Kalau kalian menggunakan template Simple untuk blog di Blogger, kalian pasti merhatiin adanya efek bayangan pada border atau pinggiran gambar dalam postingan maupun pada widget. Bagi sebagian orang mungkin nggak masalah, tapi aku lebih suka gambar yang lebih 'nyatu' dengan tulisan seperti artikel-artikel biasa pada umumnya.

Nah kalau kamu juga ingin menghilangkan efek bayangan ini, kalian bisa mengikuti cara mudah berikut ini.

Login ke Blogger > Design > Edit HTML. Nggak perlu centang expand widget templates untuk yang ini karena udah bisa langsung ditemukan keberadaanya.

Kemudian cari kode berikut ini:

.post-body img, .post-body .tr-caption-container, .Profile img, .Image img,
.BlogList .item-thumbnail img {
  padding: $(image.border.small.size);

  background: $(image.background.color);
  border: 1px solid $(image.border.color);

  -moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
  -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
  box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
}

Ganti semua angka pikselnya (px) menjadi nol. Maka hasilnya akan jadi seperti ini:

.post-body img, .post-body .tr-caption-container, .Profile img, .Image img,
.BlogList .item-thumbnail img {
  padding: $(image.border.small.size);

  background: $(image.background.color);
  border: 0px solid $(image.border.color);

  -moz-box-shadow: 0px 0px 0px rgba(0, 0, 0, .1);
  -webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, .1);
  box-shadow: 0px 0px 0px rgba(0, 0, 0, .1);
}

Klik Preview untuk melihat hasilnya. Kalau sudah benar, klik Save Template. Semoga bermanfaat.

3 comments:

Bagaimana menurut kamu?

Hai!

Blog ini tidak di-update lagi. Silahkan Browse Arsip dibawah untuk mencari yang kamu butuhkan. Terimakasih sudah berkunjung! =]

~ Gogotaro