Cara Modifikasi dan Membuat Gambar Menjadi Lebih Responsive Di Blog

Tips blogger kali ini adalah bagaimana cara membuat gambar responsive di blog. Gambar adalah suatu bagian penting dari artikel selain tulisan huruf dan angka. Gambar juga sering menjadi bahan permasalahan dikala kita akan mencoba mengupdload atau mengirim gambar dengan lebar hal ini malah membuat gambar tersebut terlihat menjadi lebih besar dari ukuran konten artikel blog. Ini tandanya bahwa gambar tersebut tidak responsive ketika merubah ukuran gambar menjadi lebih lebar pada browser anda.

Pada gambar diatas, telah dijelaskan bahwa gambar tersebut tidak responsive yang artinya gambar yang ada pada artikel postingan di blog masih bisa melewati batas lebar konten dari ukuran sebenarnya. 

Oleh sebab itu, disini saya akan memberikan sedikit tips cara mengatasi gambar yang tidak responsive atau tips mengatasi gambar yang keluar dari batas konten blog. Pada umumnya untuk mengubah gambar di blog menjadi lebih responsive kita hanya perlu menambahkan beberapa kode CSS agar gambar tersebut menjadi responsive. Oke langsung saja simak dan terapkan carannya pada berikut ini.

Cara Mengatasi Gambar yang Tidak Responsive Di Blog Dengan menggunakan CSS

Langkah pertama, masuk dan login ke dashboard blog anda. kemudian pilih menu Template > Edit HTML.

Langkah berikutnya tambahkan kode di bawah ini tepat di atas kode ]]</b:skin> atau </style>.

.post-body img {
  max-width:100%;
  height:auto;
}

Simpan template anda. Dan lihat hasil gambar.

Demikianlah bagaimana cara memodifikasi dan membuat gambar responsive di blog

Lokasi:

Berbagi :