Cara Menambahkan Widget zFPMenu Pada Blog

zFPmenu - Fixed-Position Custom Menu and Navigation/Share Widget, adalah widget "melayang" yang bisa diisi dengan menu berisi link-link sesuai keinginan.

Di dalamnya sudah termasuk navigasi scroll to top/bottom of page (scroll ke bagian paling atas/bawah halaman web) ber-engine jQuery, dan juga tombol share Twitter dan Facebook (bila diinginkan).

LIVE DEMO :
[You must be registered and logged in to see this link.]

zFPmenu Code
Put this code into your web pages (before the closing BODY tag):

Code:

<!-- zFPmenu START -->
<div id="zfpm_div" style="display:none;">
<div id="zfpm_upperBox">
Place ads, text message, or anything here.
</div>
<ul id="zfpm_ul">
<!-- Your menus start -->
<li><a href="">YOUR MENU-1</a></li>
<li class="dir"><a href="">YOUR MENU 2 (containing submenu)</a></li>
<ul>
<li class="dir"><a href="">YOUR SUBMENU 2.1 (containing sub-submenu)</a></li>
<ul>
<li><a href="">YOUR SUB-SUBMENU 2.1.1</a></li>
<li><a href="">YOUR SUB-SUBMENU 2.1.2</a></li>
</ul>
<li><a href="">YOUR SUBMENU 2.2</a></li>
<li><a href="">YOUR SUBMENU 2.3</a></li>
</ul>
<li><a href="">YOUR MENU 3</a></li>
<!-- Your menus end -->
</ul></div>
<script type="text/javascript">
var zfpm_colorTheme = 'light';   // CHOOSE COLOR THEME: 'dark' OR 'light'
var zfpm_shareButton = 'no';   // SHOW SHARE BUTTONS? 'yes' OR 'no'
</script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://blog.cyber4rt.com/widget/zfpmenu.js"></script>
<!-- zFPmenu END -->

Configuration

[Menu]
Replace menu with your own menu. Place class="dir" attribute inside li tag where you want to add submenu.


[Setting]
You can also change the color theme and the share buttons visibility setting.

zfpm_colorTheme = 'light'
Valid input: 'light' or 'dark'
Set the color theme for the menu widget.

zfpm_shareButton = 'no'
Valid input: 'yes' or 'no'
Show the Twitter 'Retweet', Facebook 'Share' and Facebook 'Like' buttons or not.

[Upper Box]
You can also place text messages, advertisements, or whatever you like in the div box with the ID zfpm_upperBox (above the menu).

WARNING !!
This script is not design for Internet Explorer 6 browser.
Instead, if you add a variable var zfpm_ieUpgradeMessage = 'yes'; to the script, it will show an upgrade notification message for IE 6 users on the top of page.

makasih om