Cara Menyembunyikan Atau Menampilkan Widget Tertentu di Mobile

Cara Menyembunyikan Atau Menampilkan Widget Tertentu di Mobile

Pada umumnya Widget yang kita pasang pada temlpate blog kita akan secara otomatis tampil dalam versi PC maupun Mobile. Namun, hal ini tidak hanya membawa manfaat pada blog, tapi juga memiliki pengaruh yang buruk pada blog. Bergantung dari cara anda menempatkannya dan menggunakannya

Blog yang baik adalah, blog yang dapat diakses di PC maupun Mobile, namun tidak jarang dari blogger kurang memperhatikan blog mereka yang tampil di Mobile, mereka hanya fokus bagaimana agar blog mereka tampil menarik dan profesional didepan pembaca, padahal membuat blog yang dapat Mobile friendly dapat meningkatkan trafik blog, karena di zaman yang serba modern, kebanyakan dari kita mengaksesnya di Mobile, karena pengaksesannya yang lebih praktir

Apa Pentingnya Menyembunyikan atau Menampilkan Widget di Mobile?
Jika anda pernah mengakses atau mencoba membuka blog anda di Mobile, ada widget tertentu yang tidak terlihat baik pada blog padahal baik-baik saja pada saat mengaksesnya di PC, apakah itu widget yang tidak mobile friendly atau widget yang bertumpuk dengan widget lainnya. inilah fungsi utama dari menampilkan atau menyembunyikan widget di Mobile, artinya jika anda menginginkan widget itu hanya tampil di versi mobile maka anda harus mengaturnya hanya tampil di mobile saja dan begitu pun sebaliknya, anda bisa mempraktekkan cara ini.

Sebelum anda mempraktekkan Caranya, sangat penting untuk membaca artikel saya yang berjudul Cara Mengetahui ID Widget pada Blog, agar tidak sesat nantinya, tapi kalau udah paham sing tinggal lanjut aja.

Ok deh, dari pada tambah penasaran, mari kita bahas satu persatu, langkah-langkahnya:

1. Buka Blogger.com
2. Pilih Template > Edit HTML
3. Di menu lompat ke widget, pilih ID Widget yang ingin anda buat tampil atau hilang di Mobile
4. Untuk Menyembunyikannya di Mobile tambahkan kode ini, seperti dibawah pada widget yang ingin dihilangkan
<b:widget id='HTML1' locked='false' title='Recent Posts' type='HTML' version='1' visible='true'>
        <b:includable id='main'>
<b:if cond='data:blog.isMobileRequest == &quot;false&quot;'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
</b:if>
</b:includable>
      </b:widget>
5. Tapi jika anda ingin menampilkannya di Mobile, kodenya seperti ini
<b:widget id='HTML2' locked='false' title='Recent Posts' type='HTML' version='1' visible='true'>
        <b:includable id='main'>
<b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
</b:if>
</b:includable>
      </b:widget>

Jadi intinya adalah jika anda ingin menyembunyikan/menampilkan widgetnya anda harus menambahkan kode ini, diatas kode widgetnya, sesuai contoh diatas, ganti kode menjadi  true untuk menampilkan dan false untuk menyembunyikan
<b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>
Kemudian tutup dengan tag penutupnya, dan letakkan sesuai contoh diatas
</b:if>

Bagiamana gan? mudah kan? yang penting anda mau mencoba dan berusaha, dan jangan ragu buat corat-coret di kolom komen dibawah kalo masih ada yang belum dimengerti yah! Semoga bermanfaat
Load disqus comments

0 komentar