Blogspot: Cara Menghapus Shadows dan Borders di Blog

Blogger.com-Tutorial singkat tentang cara menghapus bayangan dan batas yang ditemukan di beberapa template atau theme oleh Blogger. Saya bukan penggemar berat shadows, saya lebih suka desain datar yang menjadi populer. Efek bayangan bisa sangat bagus ketika digunakan secara jarang, tetapi pada template Blogger itu bisa tampak sedikit berlebihan. Posting ini akan menunjukkan kepada Anda cara menghapus bayangan dari posting blog Anda, gambar dan header. Semoga Anda merasa berguna.

CARA MENGHAPUS BOX SHADOW DAN BORDER DI BLOGGER

Kode untuk bayangan (shadow) ada di bagian CSS Anda. Untuk mengaksesnya, buka Theme > Edit HTML. Ini menunjukkan kode template Anda. CSS berada di antara <b:skin> dan ]]><b:skin>.

Jika ada sesuatu dengan bayangan atau batas di blog Anda yang ingin Anda singkirkan, cari elemen di bagian CSS dari template Anda. Cari properti box-shadow atau border dan ubah nilainya menjadi 0 atau tidak sama sekali.

#1 HAPUS BOX SHADOWS DARI BLOGGER

Temukan semua elemen di blog Anda yang memiliki bayangan kotak. Mungkin terlihat seperti berikut ini

selector {

  -moz-box-shadow: 0 0 40px rgba(0, 0, 0, .15);

  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, .15);

  -goog-ms-box-shadow: 0 0 10px #333333;

  box-shadow: 0 0 40px rgba(0, 0, 0, .15);

}

Nilai mungkin terlihat berbeda jika template blog Anda menggunakan Template Designer, jika demikian akan terlihat seperti ini

selector {

  -moz-box-shadow: 0 0 $(outer.shadow.spread) rgba(0, 0, 0, .2);

  -webkit-box-shadow: 0 0 $(outer.shadow.spread) rgba(0, 0, 0, .2);

  -goog-ms-box-shadow: 0 0 $(outer.shadow.spread) rgba(0, 0, 0, .2);

  box-shadow: 0 0 $(outer.shadow.spread) rgba(0, 0, 0, .2);

}

Anda ingin mengedit nilai dengan hati-hati pada kedua instance untuk menghapus bayangan dengan mengganti deklarasi dalam tanda kurung dengan yang berikut

/* remove shadows by xomisse */

-moz-box-shadow: none;

-goog-ms-box-shadow: none;

-webkit-box-shadow: none;

box-shadow: none;

#2 HAPUS SHADOWS DARI TEKS PADA BLOGGER

Sekali lagi pergi ke Theme > Edit HTML dan temukan bagian CSS Anda. Carilah text-shadow dan hapus deklarasi atau ubah nilainya menjadi nill.

Misalnya untuk menghapus bayangan teks dari judul blog Anda di header, cari .Header h1 dan ubah ke yang berikut

.Header h1 {
/ * hapus batas dengan xomisse * /
text-shadow: none;
}

#3 HAPUS SHADOWS DARI GAMBAR DI BLOG

Di Theme > Edit HTML, temukan yang berikut ini

.post-body img, .post-body .tr-caption-container, .Profile img, .Image img, .BlogList .item-thumbnail img

dan ubah nilainya jadi seperti ini

.post-body img, .post-body .tr-caption-container, .Profile img, .Image img, .BlogList .item-thumbnail img {

/* remove shadows by xomisse */

-moz-box-shadow: none ;

-goog-ms-box-shadow: none;

-webkit-box-shadow:none;

box-shadow:none;

}

#4 HAPUS BORDERS DARI GAMBAR DI BLOG

Sama seperti yang ditunjukkan di atas, ubah nilainya menjadi tidak ada atau hapus deklarasi.

.post-body img, .post-body .tr-caption-container, .Profile img, .Image img, .BlogList .item-thumbnail img {

/* remove borders by xomisse */

border: 0px;

}