Ide@Pelajar

Cara Membuat Foto atau Gambar di Blogger Mobile Friendly

Langsung saja berikut caranya untuk mengubah tampilan foto / image pada Blogger agar mobile friendly dengan tetap mempertahankan tampilan desktop :

1. Buka Blogger.com, login dengan akun Blogger Teman-Teman dan meluncur ke Thema ya Teman-Teman

2. Pilih Edit Thema, eits, jangan lupa untuk lakukan Backup Thema ya, jaga-jaga kalau tidak berhasil,

kita bisa mengembalikan Thema ke posisi terakhir sebelum diubah-ubah untuk mengubah tampilan image / foto.

3. Cari dan temukan kode html

]]></b:skin>

untuk memudahkan pakai CTRL + F dan paste kode tersebut

4. Opsi Pertama Copy dan Paste Kode dibawah ini tepat sebelum kode html poin 3

.mobile.post-body img{width:100%!important;height:auto!important;}

5. Setelah itu Simpan Tema dan lihat perubahannya

Jika belum ada perubahan coba ke langkah Nomor 6

6. Opsi Kedua bisa jadi ada html lain yang fungsinya mirip dengan poin 4 (post body image), dan akhirnya logic di html nya menjadi bentrok, kita akan ubah fungsi Post Body Imagenya dengan cara di bawah ini

7. Cari dan temukan kode

.mobile.post-body img,

jika yang ditemukan

.mobile.post-body img {max-width:100%}

tidak apa-apa Teman-Teman, kita akan mengubah kode sumber yang ada di dalam tanda kurung kurawal, isi dari tanda kurung kurawal bisa jadi berbeda yang ditemukan oleh Teman-Teman, karena mungkin beda Tema beda juga kode sumbernya.

8. Ganti yang ada dalam tanda kurung kurawal dengan

width:100%!important;height:auto!important;

sehingga nanti menjadi

.mobile.post-body img{width:100%!important;height:auto!important;}

9. Lanjut pilih Simpan Tema, lalu cek foto pada post tertentu yang Teman-Teman punya apakah

sudah berhasil?

Sumber :
https://www.syaffi.com/2019/11/cara-mengubah-tampilan-foto-gambar-di-blog-agar-mobile-friendly-secara-otomatis.html

Author: Abufajri

Penulis Blog Kelas Pemula Tea. Read More →