Cara Menyembunyikan Widget Blog di Tampilan Seluler - Vorzil

Cara Menyembunyikan Widget Blog di Tampilan Seluler

Hallo teman-teman blogger, dalam kesempatan kali ini saya akan mengulas tentang bagaimana Cara Menyembunyikan Widget Blog di Tampilan Seluler. Cara yang akan saya sajikan berikut adalah cara yang sangat mudah sekali untuk diaplikasikan oleh teman-teman blogger.

Sebagaimana yang kita ketahui bersama, mode tampilan seluler/mobile suatu blog itu berbeda dengan mode tampilan desktop/pc, khususnya bagi teman-teman blogger yang memakai template blogger responsive mobile friendly seperti template blog yang saya pakai ini.

Mengingat widget yang terlalu banyak membuat tampilan blog di browser seluler akan terlihat acak-acakan (tidak rapih) serta dapat membuat kinerja suatu blog juga akan menjadi lambat. Jika hal tersebut terjadi maka akan berimbas terhadap menurunnya traffic blog, karena loading blog yang lambat maka akan mudah ditinggalkan oleh para pengunjung yang hendak mencari informasi di blog kita.

Untuk meminimalisir kinerja loading blog di tampilan seluler salah satunya dengan menyembuyikan beberapa widget blog agar loading blog di tampilan seluler menjadi lebih ringan. Langsung saja berikut adalah cara-caranya :

Tutorial Menyembunyikan Salah Satu Widget Blog di Tampilan Android / Smartphone :

1. Buka dashboard blogger Tata Letak.
2. Pilih widget blog yang akan kita sebunyikan Kemudian klik Edit.
3. Setelah terbuka, lihat kode html dari widget yang akan kita sembunyikan. Lihat contoh gambar di bawah ini : Lihat kode html


4. Selanjutnya masuk ke Menu Template/Tema Edit HTML Lompat Widget, pilih kode widget yang tadi dilihat di Tata Letak. Pilih widget yang akan disembunyikan


5. Jika sudah ketemu “klik” tanda panah kecil berwarna hitam, maka akan terbuka semua kode widget yang akan kita sembunyikan. Tapi jika masih ada tanda panah setelah diklik, coba klik lagi saja sampai seluruh kode widget tadi terbuka semua. Lihat contoh gambar di bawah ini : Klik tanda panah kecil berwarna hitam


6. Kemudian tahap selanjutnya adalah menambahkan kode CSS berikut ini [kodenya yang diblok berwarna Merah] tambahkan tepat di bawah kode <b:includable id='main'> dan kemudian tambahkan juga </b:if> di bawah kode <data:content/> </div>. Contohnya bisa dilihat di bawah ini :
</b:widget-setting>
</b:widget-settings>
<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:if> <b:include name='quickedit'/>
</b:includable>
</b:widget>

7. Terakhir Klik Save Template.
8. Selesai

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel