Untuk Menampilkan Custom Mobile Template maka Langka Awal
pilih "custom/tersesuai" pada bagian "pilih template seluler"
click
"preview/pratinjau" , jika sudah yakin, silahkan tekan tombol
"save/simpan".
jika kamu memiliki widget pada dekstop templatemu, kamu dapat mengontrol tampil atau tidaknya widget tersebut di mobile template. kamu bisa menggunakan atribut mobile di <b:widget/> dengan tag "default" , "yes" , "no" dan "only" .
sebagai contoh, code widget dibawah ini, tidak akan tampil di mobile template karena menggunakan tag "no".
kamu juga bisa memberikan CSS antara dekstop and mobile template. pertama-tama, kamu harus memastikan tag <body> templatemu sama seperti dibawah ini.
ganti kode <body> dengan kode dibawah ini
pilih "custom/tersesuai" pada bagian "pilih template seluler"
sebagai contoh, code widget dibawah ini, tidak akan tampil di mobile template karena menggunakan tag "no".
<b:widget id="HTML1" locked="false" mobile="no" title="" type="HTML"/>widget dibawah ini, akan tampil di mobile template karena menggunakan tag "yes".
<b:widget id="HTML1" locked="false" mobile="yes" title="" type="HTML"/>widget dibawah ini, hanya akan tampil di mobile template karena menggunakan tag "only".
<b:widget id="HTML1" locked="false" mobile="only" title="" type="HTML"/>secara default, widget dibawah ini akan otomatis tampil di mobile template meskipun belum kita kasih tag "yes".
- Header
- Blog
- Profile
- PageList
- AdSense
- Attribution
kamu juga bisa memberikan CSS antara dekstop and mobile template. pertama-tama, kamu harus memastikan tag <body> templatemu sama seperti dibawah ini.
ganti kode <body> dengan kode dibawah ini
<body expr:class='"loading" + data:blog.mobileClass'>lalu, kamu bisa berikan CSS antara dekstop dan mobile template. seperti contoh dibawah ini:
/* For desktop view */
#main-wrapper {margin-left: 10px;overflow: hidden;width: 720px;padding-left: 20px;}
/* For mobile view */
.mobile #main-wrapper {margin:0 auto !important; width:auto !important; max-width:540px !important; padding-left: 5px; padding-right: 5px;}
letakkan di atas kode ]]></b:skin>
sumber
Membuat Custom Mobile Template
Posted by: Risalahati
Dedic Ahmad Updated at: 22:52
No comments:
Post a Comment