Seiring waktu berjalan, perkembangan zaman semakin maju, lahirlah smartphone, tablet, dan perangkat lainnya yang semakin canggih. Blog dan situs website membutuhkan penyesuaian diri, maka lahirlah istilah responsive dalam dunia blogger. Tempelate blog harus dibuat responsive agar bisa tampil menyesuaikan desktop perangkat, kalau tidak reseponsive maka blog atau website tampilannya akan jelek, terkadang terlalu lebar atau terlalu kecil.
Tampilan yang responsive ini berpengaruh juga pada isi postingan yaitu gambar dan video yang ada dalam postingan. Keduanya harus responsive, kalau tidak ya tampilannya akan jelek lagi.
Khusus untuk pengguna blogger terkadang template bawaan blog atau sebagian template blog gambarnya belum responsive. Seperti template yang saya gunakan ini. Saat pertama kali saya gunakan gambar yang ada di dalam postingan blog belum responsive sesuai dengan beberapa browser sehingga saya harus sedikit menambahkan kode CSS untuk membuat gambarnya menjadi responsive.
Cara Pasang Kode CSS Gambar Responsive di Blog
Pada dasbord blog klik tab "Template" kemudian klik tombol "Edit HTML, kemudian copy dan pastekan kode CSS di bawah ini sebelum kode ]]></b:skin> atau </style>.
.post-body img {
max-width:100%;
height:auto;
}
Cara membuat gambar sangat mudah kan? Karena hanya dengan menempatkan kode css di atas ke dalam html blog saja gambar sudah menjadi responsive, semoga bermanfaat.