Menyembunyikan Menu Ikon Mengapung Pada Tampilan Seluler

Jika pada artikel sebelumnya yang berjudul, “Membuat Daftar Artikel Terkait Pada Template Seluler Blogspot” telah diuraikan bagaimana cara untuk membuat daftar artikel terkait pada template blogspot untuk tampilan seluler, maka sebenarnya bila teknik tersebut diterapkan dalam template blog yang mengandung atau menggunakan menu ikon mengapung (floating menu with icons), menu ikon mengapung tersebut pada akhirnya juga akan dimunculkan pada tampilan seluler blog tersebut. Sehingga dengan tetap dimunculkannya menu ikon mengapung pada halaman blog untuk tampilan seluler, bisa jadi malah akan mengganggu pengunjung blog dalam membaca konten artikel.

Gambar di atas menunjukkan menu ikon mengapung yang dimunculkan pada halaman blog untuk tampilan seluler. Dimana pada gambar di atas dapat dilihat bahwa menu ikon mengapung yang dimunculkan pada halaman blog tersebut malah menutupi sebagian konten artikel. Sehingga menu ikon mengapung tersebut perlu disembunyikan agar tidak dimunculkan pada tampilan seluler blogspot, yang nantinya diharapkan dapat mempermudah pengunjung blog dalam membaca artikel yang dibukanya. Dan berikut ini adalah uraian cara yang dapat digunakan untuk menyembunyikan menu ikon mengapung pada tampilan seluler blogspot.

Untuk menyembunyikan menu ikon mengapung agar tidak dimunculkan pada tampilan blog untuk tampilan seluler, adalah dengan menambahkan kode di bawah ini diantara kode yang digunakan dalam membuat menu ikon mengapung.

<b:if cond='data:blog.isMobile'>
     .............. kosong ..............
<b:else/>
     .............. script ..............
</b:if>

Sebagai contoh dari penerapan kode di atas adalah seperti dapat dilihat pada kode di bawah ini.

<b:if cond='data:blog.isMobile'>
      
<b:else/>
  <div id='socialLinks'> <a href='https://plus.google.com/110089867578853859469' target='_blank' title='Follow us on Google+'><img alt='Google+' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPiWhpCYQY0JhKM5vTCT8wRNS8Uc2dg1U_cDP5xa3VNDNfQ-T-J0MWEFc_wMECYL_8GTi_0_uLrN7Sh-ZtYlmlFjG891H6ykSu85qA5Cd4QlyL-rNEeth2Q-TCH3bwVpRSOlYsEyzxrG8/s800/Google%2520Plus.png'/></a><a href='http://www.twitter.com/semarbingung' target='_blank' title='Follow us on Twitter'><img alt='Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuZu_4n69GQi-OgrM9Uye8Z5Kx5bSSybVETey8RjuUZgbjJn5J1IA0DIF48L75pkYZAwpC6sexBKG1h9mn9HCYxQke2ZtCPZbFLennlrdKGyTpTaNmXYxxqH3fIYNwmkuAKyvZL32oLzc/s800/twittericon.png'/></a> <a href='http://www.facebook.com/pages/eltelublogspotcom/233620213358622' target='_blank' title='Follow us on Facebook'><img alt='Facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglLHtlScvWFlcHwyNoYfwSGd7OwaX0rLQjy_7Uqcb7617iHX282bLPt5zjnTO-4yYONnsMFlhnGK5CD4OEjFx9FJiTiqPeluCrgEmctpmbueMZdEnTbXMXzugzRjj7gS2FPzxoXHJxw1Q/s800/facebookicon.png'/></a> <a href='/feeds/posts/default' target='_blank' title='Subscribe via RSS'><img alt='Atom' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQei-h2VEdRCWmgmprVoSLtiVIyQceJq7saOM8NQY2xAlRzsrX41mQf0WwJR0N-NGGzK9XEPQaIdZX6h7Vy9o3WzlPZ83kjJ8oXyIv72c4E-fwvNivnUonGTK_Q4_tjCi0SwVylQmQu4s/s800/rssicon.png'/></a> </div>
</b:if>

Dengan menambahkan kode seperti pada contoh di atas, maka bila blog dibuka dengan menggunakan perangkat seluler, secara otomatis menu ikon mengapung tidak akan ditampilkan. Sehingga dengan demikian akan mempermudah dan menjadikan pengunjung lebih nyaman dalam membaca isi artikel yang dibukanya.