Cara membuat memasang menu floating (melayang) menu adalah tampilan sebuah bagian dari suatu website blog berupa halaman atau postingan meliputi perlabel, sebuah menu dalam website fungsinya untuk mempermudah pengunjung menelusuri website blog anda ,arti floating sendiri adalah melayang jadi tampilan menu akan tetap terlihat walau bagian website di geser kebawah.
Contoh menu melayang atau floating menu yang responsive seperti dalam gambar di bawah ini
Cara membuat memasang menu melayang di blog website sebagai berikut :
1.buka dashboard blogger
2.pilih Tema lalu pilih edit HTML
3.copi kode di bawah ini dan pastekan di atas kode ]]></b:skin>
.float-menu-wrap { padding: 0; width: 100%; position: fixed; top: 0; left: 0; right: 0; background:#000; z-index: 9999; } ul.float-menu { display: block; position: relative; margin: 0; padding: 0; margin-left: 10px; margin-right: 10px; } .float-menu li { list-style: none; display: inline-block; margin: 15; position: relative; padding: 12px 0; font-size: 16px; } .float-menu li a { color: #fff; padding: 15px; font-family: georgia; font-weight: 500; } .float-menu li a:hover { background: #4B088A; color: #ffff00; }
4.copi lagi kode di bawah ini dan pastekan di bawah kode <body>
<div class='float-menu-wrap'>
<ul class='float-menu'>
<li><a href='http://www.jasa-website.web.id/'>Home</a></li>
<li><a href='http://www.jasa-website.web.id/p/pemesanan_30.html'> Order</a></li>
<li><a href='http://www.jasa-website.web.id/p/kontak.html'>Kontak</a></li>
<li><a href='http://www.jasa-website.web.id/p/kontak.html'>Pilihan Website</a></li>
<li><a href='http://www.jasa-website.web.id/2015/06/jasa-ganti-domain.html'> Ganti Domain</a></li>
<li><a href='http://www.jasa-website.web.id/2015/07/jasa-setting-website.html'>Setting Web</a></li>
<li><a href='http://www.jasa-website.web.id/2014/12/kode-warna-html.html'>Kode Warna</a></li>
<li><a href='http://www.jasa-website.web.id/2014/12/convert-parse-tools-atau-alat-parse-html.html'> Parse</a></li>
<li><a href='http://www.jasa-website.web.id/p/daftar-isi.html'>Daftar isi</a></li>
<li><a href='http://www.jasa-website.web.id/search/label/COVID-19'>COVID-19</a></li>
<li><a href='http://www.jasa-website.web.id/search/label/islam'>Dakwah</a></li>
</ul>
</div>
5.simpan template anda dan selesai
Demikian cara yang singkat detil lengkap cara membuat dan memasang floating menu di blog website blogger