Home Tutorial Blog Cara Membuat Gambar Postingan Blog Responsive Mobile

Cara Membuat Gambar Postingan Blog Responsive Mobile

by Erzed

Tutorial Blog,- Bagi pemilik blog mengurus dan mengelola blog sebaik cukup merupakan cara agar blog tersebut dapat mencapai kesuksesan, bukan dalam hal visitor saja melainkan juga pada tampilan blog tersebut. Berbicara seputar tampilan blog pasti sebagian pemilik blog ada yang sangat memperhatikannya dan ada juga yang menganggap tampilan blog menjadi hal yang belakangan sebab suksesnya blog tak di tentukan oleh sebuah tampilan. Memang benar apabila tampilan sebuah blog tak menentukan kayanya visitor, namun dengan menciptakan tampilan blog sebagus cukup dan enak di pandang tentunya akan menciptakan pengunjung semakin nyaman dan betah berlama-lama di blog yang yang dikunjungi.

Dalam struktur blog terdapat sedikit elemen mulai dari header, post dan footer, berbicara seputar 3 elemen pembangun blog tersebut cukup bagian post merupakan yang terpenting pasalnya bagian tersebut berfungsi sebagai wadah bagi tulisan artikel yang akan dibaca oleh pengunjung. Jika tampilan post tersebut berantakan tentunya akan menciptakan pengunjung kurang nyaman atau malah yang terburuk pengunjung dapat pergi ke blog lain. Oleh sebab itu tampilan untuk postingan harus diutamakan, apabila terdapat hal yang kurang pas atau sesuai harus di perbaiki.

Cara Membuat Gambar Postingan Blog Responsive Mobile 5

Tidak hanyan tampilan untuk dekstop saja, tampilan untuk mobile juga harus diutamakan. Banyak sekali template yang mempunyai tampilan bagus di dekstop namun berantakan di versi mobile, terlebih lagi sekarang algoritma google mengharuskan responsive mobile atau template harus terdapat tampilan sendiri apabila dibuka di perangkat hp. Dengan demikian tampilan mobile juga harus diutamakan, alasanya sendiri sebab sekarang orang lebih kaya menggunakan smartphone ketimbang komputer atau laptop. Nah untuk itu silahkab buat template blog anda seresponsive cukup pada tampilan mobile khususnya bagian post.

Baca :  Cara Mengecek Backlink Blog Kita Secara Gratis

Untuk template bagian post dalam versi mobile hal yang kerap menjadi masalah merupakan gambar postingan belum responsive atau gambar saat dibuka di parangkat mobile akan keluar dari konten. Tentunya hal tersebut akan menciptakan pengunjung kurang nyaman dalam melihat gambar di artikel yang melebar keluar dari konten. Nah untuk itu disini admin akan membagikan tips seputar cara mengatasi gambar keluar dari konten pada tampilan mobile. Berikut ulasannya.

Cara Membuat Gambar Postingan Responsive Mobile

1. Pertama yang pasti masuk ke Blogger.
2. Kemudian masuk ke menu Template – Edit Html.
3. Setelah itu cari kode @media screen dengan max-width 480px atau dibawahnya, lalu tambahkan kode berikut ini tepat dibawah kode tersebut.

.post img{float:left;padding:0 0 15px;margin:0;}

4. Untuk contohnya seperti dibawah ini, admin taruh di media screen max width 384px.

@media screen and (max-width:384px){
.post img{float:left;padding:0 0 15px;margin:0;}
}

5. Jika di template anda tak anda kode media screen seperti diatas silahkan copy saja kode diatas lalu paste tepat dibawah kode </style>, (Gunakan Ctrl+F) untuk mempermudah pencarian.

Nah sekarang coba lihat gambar postingan anda melalui ponsel anda atau baca cara melihat tampilan mobile blog langsung dari browser, sudah tak melebihi kontenkan. Jika belum silahkan tanya di kolom komentar. Terima kasih.

You may also like