Cara Buat Menu Apung Di Sidebar Blog

Yang dimaksud menu apung atau lebih dikenal floating menu adalah ketika scroll ke atas ke bawah, menu tersebut ikut bergerak ke atas dan ke bawah, jadi tidak diam di tempat.

Keuntungannya tentu saja akan selalu tampak terlihat. Ini sangat bermanfaat bila dipasang link-link blog unggulan ataupun iklan.

Warna background menu, lebar dan tingginya bisa disesuaikan sesuai kebutuhan. Cara buatnya lihat gambar. Kode di tempatkan persis di bawah .
Ini di menu Layout/Tata Letak lalu Edit Template. Bila sudah di simpan kode tersebut jangan lupa click Simpan Perubahan. Click gambar untuk ukuran besar.

Lalu di Menu Layout, click Tambah Gadget paste code ini dan ganti nama link dan link yang ada dengan link sendiri.
Nah, bila sudah paham betul cara pasangnya, ini Kode untuk yang di Edit Template dan di Tambah Gadget :


Ini Kode yang di bawah head menu edit template, ganti kode warna sesuai kesukaan :

<style>
div.floating-menu {position:fixed;background:#00FF00;border:1px solid #ffcc00;width:168px;z-index:100;}
div.floating-menu a, div.floating-menu h3 {display:block;margin:0 0.5em;}
</style>

Ini kode menu di Tata Letak Tambah Gadget posisinya usahakan paling atas, ganti link dan nama dengan milik sendiri :

<div class="floating-menu">
<h2>Belajar Kana dan Kanji</h2>
<a href="http://bahasajepangzenbae.blogspot.com/2008/11/huruf-katakana.html"> Katakana </a>
<a href="http://bahasajepangzenbae.blogspot.com/2008/11/huruf-hiragana.html"> Hiragana </a>
<a href="http://bahasajepangzenbae.blogspot.com/2008/11/bahasa-jepang-hari-minggu-nichiyoobi.html"> Kanji </a>
<a href="http://www.twitter.com/davidchanka"> Follow Me On Twitter </a></div>