Melihat daripada hampir semua pengguna browsing terbesar di dunia semua akses dengan smartphone.
Tetapi bukan berarti tema asli tidak bagus,karena hanya sedikit merubah script tertentu saja,semua melakukan untuk mempermudah bagi para pengguna yang notabene selalu pakai smartphone dalam keseharian.
Tidak mungkin sebuah upaya tanpa adanya tujuan,pada dasarnya semua weblog yang di buat adalah sama untuk di akses dalam bentuk komunikasi,hanya tampilan saja yang berbeda kerena bisa dirubah menjadi lebih mobile friendly.
Tiada lain itu semua di lakukan untuk satu langkah yaitu audien target.
Hal ini sebenarnya sudah banyak sekali di terapkan oleh para pemilik weblog,tetapi apa salahnya saya sendiri menulis dan paling tidak bisa untuk diri sendiri sebagai catatan blog...:D
Bacaan lain :
.Cara embed post facebook ke website/Blog.
.Mendaftarkan web/blog ke yandex webmaster tool
.Menapak sejarah kesultanan cirebon di pegunungan jati
.mengenal dan menggunakan bing webmaster tool untuk blog
.perbedaan fitri dan fitrah di hari raya islam
.cara setting logo nama web/blog posisi ditengah header
Pertama yang harus dilakukan masuk dulu blog dan buka tema langsung klik edit html,lalu cari code :
<b:if cond='data:blog.ismobile'>
<meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'/><b:else/><meta
content='width=1100'
name='viewport'/></b:if>
<meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'/><b:else/><meta
content='width=1100'
name='viewport'/></b:if>
<meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'/>
Berlanjut lagi dan cari code untuk gambar:
.post-body img, .post-body .tr-caption-container {padding:0;width:auto;max-width:100%;height:auto;}
Kemudian yang terakhir cari code <head> dan paste script di bawah ini tepat di atasnya:
<style type='text/css'>
@media screen and (max-width:1024px){
body,.content-outer, .content-fauxcolumn-outer, .region-inner {width:100%!important;min-width:100%!important;padding:0!important} body .navbar {height: 0!important;} .footer-inner {padding:30px 0px!important;}
}
@media screen and (max-width: 603px){ .main-inner .columns {padding-right: 0!important;} .main-inner .column-right-outer {width:100%!important;margin-right: 0!important;}
}
</style>
Merubah tampilan blog responsive sudah selesai,tetapi pasti ada sedikit kekurangan yaitu tampilan mobile dan desktop menjadi hampir sama,jika dibuka versi mobile akan nampak terlihat bagus,namun jika dibuka ke versi desktop menjadi tampilan seperti mobile dan kurang begitu menarik pada tampilannya.Satu hal bagusnya karena pengguna saat ini adalah akses dengan smartphone,kenapa tidak harus dirubah jika mendukung untuk itu semua.
Pilihan hanyalah pada individu orang sesuai masing-masing kebutuhan.
Sebelah atas ini adalah hasil gambar versi desktop menjadi seperti mobile version.
Tidak ada komentar:
Posting Komentar