01 January 2017

Cara Menampilkan Atau Menyembunyikan Widget Blog Di Versi Mobile

Cara Menampilkan Atau Menyembunyikan Widget Blog Di Versi Mobile - Seiring dengan perkembangan zaman, sudah banyak bermunculan smartphone yang memiliki fitur canggih, sehingga lebih banyak orang yang mengakses suatu web maupun blog menggunakan handphone pintar miliknya, karena akan menjadi lebih mudah dan lebih praktis di bandingkan menggunakan perangkat komputer maupun laptop.

Tetapi jika seseorang mengakses blog kita yang memiliki tampilan berat atau sangat banyak widget - widget melalui smartphone, pasti mereka akan terganggu, mengapa demikian, karena smartphone tidak seperti laptop maupun komputer yang memiliki layar lebih besar sehingga tampilan blog kita tampil dengan sempurna, lalu bagaimana jika di akses di smartphone ?.


Seseorang mengunjungi situs kita melalui smartphone lebih fokus untuk membaca artikel, bukan untuk melihat - lihat tampilan blog kita, jadi agar tampilan blog kita lebih simpel di versi mobile atau tampilan mobile device sebaiknya widget - widget yang tidak perlu di sembunyikan saja, begitupun sebaliknya, jika widget yang hanya perlu ditampilkan di mobile saja, tidak perlu ditampilkan di saat di buka di komputer maupun laptop. Bagaimana caranya ? mari disimak.

Menampilkan Atau Menyembunyikan Widget Blog Di Versi Mobile

Berikut ini ada dua cara yang akan saya bagikan tutorialnya, yang pertama adalah menampilkan widget blog di mobile device, jika melakukan cara ini widget blog hanya akan tampil di versi mobile saja, jika di buka melalui komputer widget tidak akan tampil, yang kedua adalah menyembunyikan widget blog di mobile device, ini adalah kebalikan cara pertama, jika melakukan cara ini widget blog hanya akan tampil di komputer saja, jika di buka versi mobile widget blog tidak akan tampil.

Sebelum melakukan cara ini, sobat harus mengetahui id html untuk widget yang ingin sobat tampilkan atau sembunyikan di versi mobile, caranya adalah dengan cara membuka tata letak, lalu lihat bagian widget sobat, pilih yang mana ingin sobat tampilkan atau sembunyikan, lalu klik edit widget, nah lihat dibagian url atau link widget, scroll ke kanan sampai menemukan widget id, lalu ingat idnya, contoh HTML6.


Cara Menampilkan Widget Blog Di Mobile Device

Buka edit html blog di menu template, lalu cari id html widget yang tadi, disini id yang saya gunakan adalah HTML6, gunakan Ctrl + F untuk melakukan pencarian lalu tulis HTML6, sehingga menemukan kode kurang lebih seperti di bawah ini.

<b:if cond='data:blog.isMobileRequest == "true"'>
<b:widget id='HTML6' locked='false' title='' type='HTML' version='1' visible='true'>
----- isi dari widget -----
</b:widget>
</b:if>

Lalu buat seperti kode di atas, yakni menambahkan kode tag kondisional yang saya tandai di atas, sehingga kode yang semula hanya b:widget di awali dan ditutup dengan kode tag kondisional.

Cara Menyembunyikan Widget Blog Di Mobile Device

Sama seperti cara diatas, buka edit html blog di menu template, lalu cari id html widget yang tadi, disini id yang saya gunakan adalah HTML6, gunakan Ctrl + F untuk melakukan pencarian lalu tulis HTML6, sehingga menemukan kode kurang lebih seperti di bawah ini.

<b:if cond='data:blog.isMobileRequest == "false"'>
<b:widget id='HTML6' locked='false' title='' type='HTML' version='1' visible='true'>
----- isi dari widget -----
</b:widget>
</b:if>

Lalu buat seperti kode di atas, yakni menambahkan kode tag kondisional yang saya tandai di atas, sehingga kode yang semula hanya b:widget di awali dan ditutup dengan kode tag kondisional.

Dari kedua kode tag kondisional di atas, dapat di ambil kesimpulan apabila mobile request di tag kondisionalnya true, maka widget akan di tampilkan di versi mobile dan hanya akan tampil di mobile device saja, apabila mobile request di tag kondisionalnya false, maka widget akan di sembunyikan di versi mobile dan hanya akan tampil di komputer saja.

Apabila ada pertanyaan jangan sungkan untuk bertanya melalui kotak komentar, semoga bermanfaat.
Disqus Comments