Cara Menciptakan Hidangan Melayang (Floating Menu) Di Blog

Cara Membuat Menu Melayang (Floating Menu) di Blog - Menu Melayang atau biasa disebut Floating Menu ialah sebuah widget sajian yang selalu tetap berada diatas halaman blog, walaupun sudah kita scroll halaman blog tersebut hingga ke bawah. Bila Anda ingin mencoba Membuat Menu Melayang (Floating Menu) di Blog, silahkan simak tutorialnya memberikankut ini.

Klik Gambar untuk memperbesar

Berikut Cara Membuat Menu Melayang (Floating Menu) di Blog :

1. Login ke Account Blogger Anda.
2. Masuk ke Dasbor Blog.
3. Pilih sajian Template, kemudian klik Edit HTML.
4. Cari instruksi ]]></b:skin>, kemudian copy instruksi CSS memberikankut ini diatas instruksi ]]></b:skin>.

/* -- Floating Menu by --*/
#menutop{background:#0077AF;font:14px Oswald;width:960px;position:fixed;z-index:9999;top:1px;overflow:hidden;border:1px solid #999;box-shadow:0 0 4px #888;-moz-box-shadow:0 0 4px #888;-webkit-box-shadow:0 0 4px #888;text-shadow: -1px -1px 0 #006092;}
#navmenu{margin:0 auto;width:960px;padding:0}
#navmenu ul{float:right;width:auto;margin:0;padding:0;list-style-type:none}
#navmenu ul li{float:right;}
#navmenu ul li a,#nav ul li a:visited{float:right;padding:10px 10px;color:#fff;text-transform:none}
#navmenu ul li a:hover{color:F2F2F2;text-decoration:none;background:#006A9B}

5. Lalu copy instruksi dibawah ini sempurna diatas instruksi <div id='header-wrapper'>.

<div id='menutop'>
<div id='navmenu'>
<ul>
<li><a href=' /search?q=contact-us'>Kontak Kami</a></li>
<li><a href=' /search?q=contact-us'>Pasang Iklan</a></li>
<li><a href='http://tutorial-blogz.blogspot.com/p/kirim-artikel.html'>Kirim Artikel</a></li>
<li><a href='http://tutorial-blogz.blogspot.com/'>Home</a></li>
</ul>
</div>
</div>