Cara Menghilangkan Border Image di Foto Blog - Garis Pembatas Gambar

Baca Juga

Cara Menghilangkan Border Image di Foto Blog - Garis Pembatas Gambar.

Gambar, foto, atau ilustrasi di blog dengan template bawaan Blogger biasanya ada border (pembatas) atau bingkai. Itu namanya "border image".

Sebagain blogger mungkin merasa kurang "sreg" dengan border image. Bagaimana cara menghilangkannya?

Fungsi border image itu hanya untuk memperindah, tidak ada kaitan dengan SEO blog ataupun loading blog. Namun, umumnya gambar di posting lebih baik tanpa border.

Cara Menghilangkan Border Image di Foto Blog

Ini dia Cara Menghilangkan Border Image di Foto Blog. Sebaliknya, ini pula Cara membuat Border Image di Foto Blog jika menginginkannya.

Intinya, cukup mengganti angka 1 (satu) atau 2 (dua) menjadi angka 0 (nol) di bagian kode, semisal "border: 1px solid #dddd;" menjadi "border: 0px solid #dddd;" atau dengan MENGHAPUSNYA . Hapus saja kode yang diawali dengan border itu di bagian kode img, post img, atau post-body img.

1. Login > Dashboard
2. Klik Template > Edit HTML
3. Cari kode di bawah ini (pastinya tiap template beda-beda, makanya dikasih banyak alternatif), namun umumnya diawali kode .post img

.post img {border:1pxsolid $bordercolor;margin:4px;padding:4px}

ATAU

.post img {padding:4px;border:1px solid $bordercolor;}

ATAU

.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: 1px 1px 5px rgba(0, 0, 0, .1);-webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, .1);box-shadow: 1px 0px 0px rgba(0, 0, 0, .1);}

ATAU

.post-body img, .post-body .tr-caption-container, .Profile img,.Image img, .BlogList .item-thumbnail img {border: 0px;-moz-box-shadow: 0px 0px 0px rgba(0, 0, 0, .0);-webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, .0);box-shadow: 0px 0px 0px rgba(0, 0, 0, .0);border-radius: 0px 0px 0px 0px;background: none;}

Untuk kemudahan pencarian kode di atas, gunakan tombol Find atau tekan Ctrl + F, masukan kode
.post img {

4. Ganti nilai border: 1px menjadi border:0px;
5. Save Tamplate!

Biasanya, gambar yang menggunakan border image juga ditambah kode padding, misalnya padding:5px. Nah, ubah pula kode padding itu menjadi padding:0.

Demikian Cara Menghilangkan Border Image di Foto Blog - Garis Pembatas Gambar. Good Luck & Happy Blogging! (www.contohblog.com).*