Cara Menampilkan Widget Pada Blog Versi Mobile Atau Widget Tampilan Halaman Seluler

Widget, inilah elemen halaman yang dapat disebut sebagai bagian tak terpisahkan dalam suatu blog. Setelah membuat sebuah blog, dapat dipastikan bahwa salah satu hal yang dilakukan adalah memasang atau menambahkan widget tertentu pada blog yang dimaksud dengan tujuan untuk ‘mempercantik’ atau mempermudah dalam melakukan navigasi. Namun seperti yang kita tahu bahwasanya setelah melakukan penambahan widget tertentu, maka widget tersebut (secara default) hanya ditampilkan pada halaman blog versi web saja.

Merujuk panduan kustomisasi template seluler Blogger (dalam hal ini dapat dibuka pada URL http://code.blogger.com/2011/11/introducing-custom-mobile-templates.html), bahwasanya untuk beberapa jenis widget tertentu, yaitu header, blog, profile, pagelist, AdSense, dan attribution, selain ditampilkan pada halaman versi web, maka (secara default) juga akan ditampilkan dalam halaman versi seluler.

Walau widget yang dapat ditampilkan pada kedua versi blog hanya beberapa buah, bukan berarti kita tidak dapat menampilkan widget yang lainnya pada tampilan versi seluler maupun versi web. Karena sebenarnya kita dapat menambahkan atribut tertentu pada widget yang dimaksud agar dapat ditampilkan pula pada blog versi seluler (mobile=’yes’), tidak ditampilkan pada halaman versi seluler (mobile=’no’), atau hanya ditampilkan pada versi seluler saja (mobile=’only’).

Dengan demikian apabila kita menambahkan atribut tersebut pada widget yang dikehendaki, maka akhirnya widget yang dimaksud akan dimunculkan pula dalam tampilan versi seluler (sebagai contoh misalnya widget artikel populer, artikel terbaru, kategori artikel, kotak penelusuran, dan lain sebagainya).  Akan tetapi perlu diingat bahwa agar beberapa atribut ini dapat bekerja atau berfungsi, maka pilihan template seluler yang digunakan haruslah ‘Tersesuai (Custom)’.

Nah, sekaligus menanggapi pertanyaan Sobat Blogger dalam artikel tanya jawab mengenai bagaimana cara membuat kotak pencarian pada tampilan seluler, maka artikel ini merupakan uraian jawaban atas pertanyaan tersebut. Lantas bagaimana cara mengimplementasikannya? Caranya adalah serupa dengan teknik menyembunyikan widget pada tampilan blog versi mobile, seperti yang saya uraikan dalam artikel sebelumnya. Dimana untuk melakukannya Anda dapat mengerjakan langkah-langkah berikut ini secara berurutan.

Pertama, buka editor template dengan cara mengeklik menu ‘Template’ > ‘Edit HTML’ > ‘Lanjutkan’ > ‘Expand Template Widget’.

Kedua, cari widget yang akan ditampilkan pula pada tampilan versi mobile. Untuk mempermudah dalam menemukannya, lakukan pencarian sesuai dengan judul yang dipakai pada widget yang dimaksud.

Ketiga, apabila widget yang dimaksud sudah ketemu, maka tambahkan kode mobile='yes' dalam rangkaian kode widget yang dimaksud. Sebagai contoh misalnya seperti yang tampak pada rangkaian kode di bawah ini.

<b:widget id='Profile1' locked='false' mobile='yes' title='About Me' type='Profile'>
  <b:includable id='main'>

    ----- rangkaian kode -----

  </b:includable>
</b:widget>

Keempat, simpan template.

Namun demikian perlu diingat pula bahwa, selain pilihan template seluler yang digunakan haruslah ‘Tersesuai (Custom)’, bahwasanya tampilan widget versi seluler yang dihasilkan dari penggunaan teknik ini adalah di area footer atau di bawah tombol navigasi (seperti yang tampak pada gambar di atas). Dan dengan adanya baris tombol navigasi di atas widget, bisa jadi tampilan akan terkesan kurang menarik. Sehingga agar tampilannya menjadi lebih menarik, maka tidak ada salahnya apabila baris tombol navigasi dihilangkan atau disembunyikan. Dimana apabila Anda ingin menyembunyikan tombol navigasi untuk tampilan versi seluler, maka tutorialnya dapat Anda lihat dalam artikel yang berjudul “Cara Menghilangkan Baris Tombol Navigasi Pada Tampilan Blog Versi Mobile”.

Semoga berguna dan bermanfaat.

Salam.