Cara Menampilkan Widget /Gadget di Tampilan Seluler blogspot

KerjaTerus.com -  Sepertinya kata kata ini sering menjadi pertanyaan oleh  para blogger: Bagaimana cara menampilkan widget di tampilan seluler Blogspot. dan Bagaimana cara edit template agar widget bisa terlihat di template seluler blogspot. Jadi kalau diakses lewat browser ponsel widget tersebut juga ikut terlihat.

Blog platform Blogspot memang terus mengembangkan fiturnya agar juga mobile friendly. karena, melihat perkembangan pengakses internet mobile yang semakin banyak, saya rasa sudah sepantasnya tampilan mobile sebuah blog turut diperhatikan pula. Selain tampilan desktop yang merupakan tampang utamanya.

Berbeda dengan tampilan versi desktop yang kita sangat bebas menggunakan aneka widget penghias blog, tampilan versi mobile harus lebih sederhana. Ringan diakses itu yang paling utama. Selain agar hemat paket data, juga agar loadingnya tak terlalu lama. Menurut saya tampilan blogspot mobile sudah memenuhi kriteria itu, ringan dan sederhana. Tapi itu tak berarti minim fasilitas navigasi. Nah, ini yang ingin sedikit saya jelaskan. Yaitu cara menampilkan widget di tampilan blogspot mobile agar tampilan mobile blog blogspot lebih hidup. Nantinya akan ada sedikit setting yang sudah disediakan blogspot dan sedikit utak-atik kode. 
kiranya tidak panjang lebar lagi kata2 dari saya selaku admin kerjaterus.com bagaimana kalau kita langsung saja ke tkp.

Contoh widget yang tampil di versi seluler seperti gambar di bawah ini:

Pertama tentu saja masuk dulu ke Dashboard blogspot. Sudah? Lanjut. Lalu pilih menu Template.

Terlebih dahulu kita akan mengaktifkan fitur custom mobile template blogspot (jika punya sobat belum diaktifkan). Klik gambar atau icon gear di bagian bawah template seluler.

Pilih “Ya. Tampilkan template seluler di perangkat seluler.” atau ”Yes. Show mobile template on mobile device.”

Dropdown pilihan template seluler. Pilih Tersesuai atau Custom yang berada paling bawah. Kemudian Simpan. Dengan begini custom mobile template blogspot sudah aktif. Template seluler akan menyesuaikan dengan template desktop. Berikutnya adalah mengatur widget yang akan tampil di template seluler atau tampilan mobile.

Secara default widget Pagelist, Profile, Atribusi, Header, Blog post dan Adsense akan tampil di template seluler tanpa pengaturan lebih jika sobat telah memasangnya di template desktop. Lalu bagaimana dengan widget yang lain? Edit kode dulu.

Syarat pertama dan utama widget tersebut harus sudah ada atau tambahkan dahulu melalui menu Tata Letak. Kalau sudah ada mari kita lanjut ke tahap berikutnya. Kembali lagi ke menu Template.

PIlih Edit HTML.

Selanjutnya kita akan menambahkan Property mobile pada tag  <b:widget>.
Cari kode <b:widget id
Gunakan Crtl+F agar mudah mencarinya. Ketikkan kode diatas pada kotak pencarian.

Kode ini ada banyak dan mungkin menyebar tergantung widget dan letaknya di template. Saya contohkan kita akan mengatur widget Popular Posts agar tampil di template seluler. Maka carilah kode seperti di bawah atau setidaknya mirip dengan kode tersebut.

<b:widget id='PopularPosts1' locked='false'  title='Popular Posts' type='PopularPosts'/>

Asli kodenya seperti itu. Lalu tambahkan sedikit kode. Property mobile ini ada 3 nilai, yaitu Yes, No,dan Only

<b:widget id='PopularPosts1' locked='false' mobile='yes' title='Popular Posts' type='PopularPosts'/>

Pada kode yang berwarna merah, jika sobat menginginkan widget tersebut terlihat di tampilan mobile dan tampilan desktop maka isi dengan 'yes'. Jika ingin hanya tampil di template seluler saja isi dengan 'only'. Dan 'no' jika ingin hanya menampilkan di template desktop dan menyembunyikannya di tampilan mobile.
Selesai, Simpan Template lalu cek hasilnya.
   
Semoga tutorial cara menampilkan widget di tampilan seluler blogspot bisa bermanfaat untuk shobat semua. 
Jika ada pertanyaan silahkan isikan di kotak komentar..
Salam, Kerjaterus.com

• Tweet
• Share
• Share
• Share
• Share