Cara Simple Menghilangkan Border Foto atau Gambar Pada Postingan di Blog

Translate

Cara Menghilangkan Border Gambar atau Foto
Contoh lihat gambar dibawah ini ... anda bisa lihat perbedaannya!!!

Sebelumnya saya pernah memposting yaitu bagaimana Cara Menghilangkan Border Gambar di blog. dan pada pada halaman lainnya How to Eliminate Border for Posting Articles
Namun ada yang masih kurang dalam postingan tersebut karena masih saja ada yang tidak work sehubungan saya menggunakan template yang baru.

Saat saya mencoba untuk mengotak-atik template blog, Setelah saya coba untuk setting template beberapa kali melalui perancangan template yang ada pada blogger ternyata hasilnya tidak ada perubahan, kemudian saya coba kolaborasikan dengan cara manual yaitu dengan menyisipkan kode border="0" pada url gambar dan hasilnya sama saja.

Sebenarnya border gambar tidaklah berpengaruh apa-apa, namun jika dilihat secara seksama terkadang risih, apalagi blog yang sering menggunakan gambar saat menerbitkan postingannya. Siapa sih yang tidak mau tampilan blognya kelihatan elegan dan profesional serta SEO friendly ?. Saya yakin semua blogger mau, begitu pula dengan Anda dan saya.

Untuk itu, pada kesempatan kali ini saya menyempatkan diri untuk memposting artikel ini, yang saya persembahkan untuk anda yang ingin tampilan blognya kelihatan lebih elegan dan menarik. Sebenarnya banyak blogger yang telah memposting mengenai menghilangkan border gambar saat memposting artikel, namun saya lebih memilih versi saya, karena sebelumnya ada yang berbeda dan perbedaan itu yang membuat saya tertarik untuk memposting tutorial ini.

Nah, sekarang bagaimana tertarik untuk mencobanya ? jika demikian perhatikan penjelasan dibawah ini sambil mempraktekannya kedalam blog Anda.

Untuk yang memakai template klasik :
1. Sign in di blogger
2. Klik menu Template
3. Klik menu Edit HTML
4. Download template Anda terlebih dahulu atau copy seluruh template kedalam notepad (penting)
5. Lalu Cari kode berikut pada css Anda (ini contoh saja):
    (cukup cari "post img" dgn Ctrl+F)

Selanjutnya tutorialnya buka / open  dibawah ini

.post img { <-- perhatikan kode ini

padding:4px;

border:1px solid $bordercolor; <-- yang di rubah kode yg ini

}

tentunya setiap template berbeda-beda, akan tetapi biasanya selalu ada kode .post img

6. Rubah angka 1 (satu) menjadi angka 0 (nol), sehingga kodenya menjadi seperti ini :

.post img {

padding:4px;

border:0px solid $bordercolor;

}

7. klik tombol Simpan Perubahan Template

8. Selesai.

Untuk yang memakai template baru :

1.    Sign in

2.    Klik menu Layout

3.    Klik menu Edit HTML

4.    Klik tulisan Download Template Lengkap, silahkan save dulu template sobat untuk backup data

5.    Klik kotak kecil di samping tulisan Expand Template Widget

6.    Tunggu beberapa saat sampai proses selesai

7.    Cari kode berikut pada css sobat (ini contoh saja):

.post img { <-- perhatikan kode ini

padding:4px;

border:1px solid $bordercolor; <-- yang di rubah kode yg ini

}

Jika tidak ada, maka cari kode yang mirip dengan kode dibawah 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: 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);
}

Tentunya setiap template berbeda, kemudian ganti angka yang berwarna merah dengan "0"

8. Klik tombol SIMPAN TEMPLATE

9. Selesai.

Selanjutnya jika anda ingin memasukkan gambar sisipkan kode border="0"  pada url gambar Anda.
Contoh : <img src="http://amen24.googlepages.com/face5.gif" border="0"> 

Sepertinya sudah cukup jelas, oh iya, jika ingin mengetahui berapa harga blog atau website anda, silahkan anda baca pada halaman lainnya dibawah;
Cara Mengetahui Berapa Harga Blog Anda
HOW TO KNOW WHAT PRICE AND RATING BLOG

dan artikel yang mungkin berhubungan dengan blog anda;
Cara Alternatif agar Blog kita Mudah Dicari di Google
Easy way to make our blog Searched in Google

Demikian semoga bermanfaat ...

Edit ; wawan surya
Sumber;
www.affiliate-waones.com
http://waones-sbm.blogspot.com
http://mitra-sbm.blogspot.com
merchant 

Artikel Menarik Lainnya :