Membuat Gambar di Postingan Blog Otomatis Besar Responsive

Cara Membuat Gambar di Postingan Blog Otomatis Besar Responsive - Ketika kita membuat sebuah artikel blog akan lebih menarik apabila kita memasukan gambar pada aartikel tersebut. Namun adakalanya gambar pada postingan blog tersebut ukurannya berbeda - beda ada yang kecil/besar, ini akan menjadi suatu masalah terutama untuk orang yang berjiwa seni terkesan itu kurang pas atau kurang menarik ketika para pengunjung blog mampir di blog kita.

Thumbnail

Nah pada postingan kali ini admin akan memberikan tutorial tentang Cara Membuat Gambar di Postingan Blog Otomatis Besar Responsive.

Untuk membuat gambar otomatis besar / fit to page ini menggunakan CSS. Script ini admin telah terapkan pada template Viomagz dan hasillnya alhamdulillah 100% work tanpa ada masalah pada tampilan blog kita atau mengganggu script lain yang ada pada blog kita.

Membuat Gambar di Postingan Blog Otomatis Besar dan Responsive

Cara - caranya adalah sebagai berikut:

1. Silahkan anda masuk ke Dashboard blog.

2. Kemudian pilih Template lalu Edit HTML

3. Selanjutnya cari code ]]> , gunakan ctrl+f untuk mempermudah pencarian.

Berikut scriptnya:

.post-body img {
width:700px!important;
height:auto!important;}

4.  Copy dan paste-kan berikut diatas ]]>

5.  Kemudian Simpan Template tersebut.

Selesai !!

Baca Juga: Cara Membuat Widget Popular Post Keren

Note:

• Kamu dapat menyesuaikan ukuran lebar gambar dengan merubah bagian 700px
• Kamu juga dapat merubah ukuran tinggi pada gambar dengan merubah bagian auto disebelah height: kamu dapat memasukan ukuran yang sesuai. Misalnya 700px, atau kamu menyesuaikan sendiri dengan ukuran lebar gambar.
• Jika kamu ingin menambahkan garis tepi (border) pada setiap gambar, paste-kan code ini di bawahnya: border: 1px solid #d2d2d2 , ketebalan garis dan warna garis bisa kamu ubah sendiri.

Kamu juga bisa merubah code CSS yang kita bahas di atas menjadi:

.post-body img {
max-width: 600px;
}

code ini hanya akan menentukan lebar maksimal pada setiap gambar yang kamu gunakan.

Maka setiap gambar yang ukuran lebarnya melebihi 600px, maka gambar tersebut akan secara otomatis hanya akan memiliki ukuran 600px.

Jika ingin menambahkan pengaturan tinggi maksimal, kamu dapat menambahkan   max-height:600px; Gambar yang lebih kecil dari itu, tetap akan memiliki ukura kecil tanpa resize apapun.

Pastinya ukuran 600px di atas bisa kamu ubah dan kamu sesuaikan sendiri.

Demikian pembahasan kali ini tentang Membuat Gambar di Postingan Blog Otomatis Besar Responsive, semoga bermanfaat buat kita semua.

Blog Tutorial

• Share
• Share

Dapatkan Tips Menarik Setiap Harinya!

• Dapatkan tips dan trik yang belum pernah kamu tau sebelumnya
• Jadilah orang pertama yang mengetahui hal-hal baru di dunia teknologi
• Dapatkan Ebook Gratis: Cara Dapat 200 Juta / bulan dari AdSense