Oke, sebelum menjelaskan tutorial agar blog di hp bisa rapi dan semua fiturnya berfungi, saya akan menceritakan pengalaman saya yang pusing karena tampilan blog. Awalnya saya bingung,
kok blog di hp nggak rapi, terus tulisan artikel blog di hape saya itu tidak bisa di klik, padahal kalau di
browser laptop atau computer itu bisa di klik dan dibuka. Ternyata ada yang
salah pada pengaturannya. Akhirnya saya mencari – cari di blog lain dan
berhasil menemukan kode skrip yang saya inginkan. Tetapi setelah memakai kode
tersebut tidak berpengaruh sama sekali. Ternyata blog yang saya kunjungi
tersebut tidak menjelaskan secara detail. Agar kode tersebut berpengaruh
membuat blog kita menjadi rapi dan bisa di klik atau dibuka artikelnya,
kita harus mengubah setingan template
blog. Yaitu dengan mematikan template seluler. Ikuti caranya seperti gambar
dibawah ini.
1.
2.
Yang pertama, buka
blogger. Kemudian klik template disebelah kiri. Setelah itu klik tanda
lingkaran bergerigi pada template tampilan seluler/hp. Kemudian pilih tidak,
tampilkan template seluler di template seluler. Klik simpan/save. Berhasil deh.
Saya pun berhasil menonaktifkan
template seluler di blog saya. Akantetapi ketika memakai kode tersebut, malah
blog saya muncul full di hp seperti tampilan blog di browser laptop atau computer. jadinya lebar banget kalau tampilan pc itu, membuat pembaca tidak nyaman. Lihat gambarnya dibawah ini.
Hanya coba – coba. Saya
rasa ada yang salah dengan lebar pada desain tersebut. Masa lebar tampilan di
seluler kok 1100. Lalu saya ubah menjadi 800. Saya simpan dan setelah itu saya
coba membuka desain tersebut lewat hp dan akhirnya berhasil deh, lebarnya sesuai dengan layar hp. Tampilannya
menjadi seperti dibawah ini.
Lalu bagaimana cara
penggunaan kodenya? Lihat langkah dibawah ini
1. Carilah kode seperti dibawah ini di template blog anda
<b:include data='blog' name='all-head-content'/>
2. Kalau sudah ketemu, selanjutnya taruh kode berikut di bawah kode diatas:
<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>
<b:if cond='data:blog.isMobile'>
<meta content='width=device-width, initial-scale=1.0, user-scalable=0' name='viewport'/>
<b:else/>
<meta content='width=1100' name='viewport'/>
</b:if>
3. Kemudian simpan template jika sudah selesai memasang kode tersebut.
<b:include data='blog' name='all-head-content'/>
2. Kalau sudah ketemu, selanjutnya taruh kode berikut di bawah kode diatas:
<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>
<b:if cond='data:blog.isMobile'>
<meta content='width=device-width, initial-scale=1.0, user-scalable=0' name='viewport'/>
<b:else/>
<meta content='width=1100' name='viewport'/>
</b:if>
3. Kemudian simpan template jika sudah selesai memasang kode tersebut.
Pada width bisa kita
sesuaikan 1100 bisa diganti 800 atau sesuai selera anda sampai benar – benar nyaman.
Comments
Post a Comment