Cara memasang ZFP menu pada blog Cara memasang ZFP menu pada blog

Kali ini saya akan berbagi buat sobat Randy, yang ingin membuat atau memasang ZFP menu pada blog anda. ZFP Menu merupakan Tombol Navigasi untuk blog. yang mungkin untuk para sobat bloger yang memerlukannya, disini saya akan menampilkan atau sedikit berbagi bagaimana cara dan tutorial membuat ZFP menu pada blog anda. Memang agak sedikit ribet siih.. karena Menu blog ini  Script ini tidak desain untuk Internet Explorer 6 browser.Sebaliknya, jika Anda menambahkan variabel zfpm_ieUpgradeMessage var = 'yes ', untuk script, ia akan menampilkan pesan pemberitahuan upgrade di bagian atas halaman . 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).


Tutorialnya :
1. Masuk ke blog sobat masing-masing
2. Buka Rancangan>>Pengaturan HTML
3. Beri tanda centang pada Expand Widget Templates
4. Cari kode </body> agar lebih mudah mencarinya tekan ctrl + f

Copy kode di bawah ini di atas kode </body>

<!-- zFPmenu START -->
<div id="zfpm_div" style="display:none;">
<div id="zfpm_upperBox">

Kemuadian Letakkan alamat, pesan text atau apapun sesuai selera anda.

</div>
<ul id="zfpm_ul">
<!-- Your menus start -->
<li><a href="http://irrandy.blogspot.com/">MENU</a></li>
<li class="dir"><a href="http://irrandy.blogspot.com/2013/11/about-me.html/">About Me</a>
<ul>
<li class="dir"><a href="#">YOUR SUBMENU 2.1 (containing sub-submenu)</a>
<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>
<li><a href="#">YOUR SUBMENU 2.2</a></li>
<li><a href="#">YOUR SUBMENU 2.3</a></li>
</ul>
</li>
<li><a href="#">YOUR MENU 3</a></li>
<!-- Your menus end -->
</ul></div>
<script type="text/javascript">
var zfpm_colorTheme = 'light'
var zfpm_shareBox = 'no';
</script>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'/>
<script src='http://zfpmenu.googlecode.com/svn/trunk/js/zfpmenu.js' type='text/javascript'/>
<!-- zFPmenu END -->

Selanjutnya Save Template....
Nb : ganti kode yang warna merah sesuai keinginan sobat

Keterangan :
Jika pada template blog sobat sudah terpasang script Jquery 1.4.2, maka sobat tidak perlu memasangnya lagi, dan tinggal menghapus :
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'/>
tapi jika belum terpasang tidak perlu di hapus.

Keterangan :

Menu
Ganti menu dengan menu sendiri.(tempat class="dir") atribut dalam(tag li) di mana Anda ingin menambahkan submenu

Setting/VariableAnda dapat mengubah warna tema dan berbagi pengaturan tombol visibilitas.

var zfpm_colorTheme = 'light';
Set the color theme for the menu widget.
Valid input: 'light' or 'dark'
var zfpm_shareBox = 'no'
Show the Twitter ‘Retweet’, Facebook ‘Share’, and Facebook ‘Like’ buttons (using LinksAlpha’s widget) or not.
Valid input: 'yes' or 'no'

Setting Preview

Color theme:               Dark     Light
Show share box:          Yes       No

Reset All settings (reload page)

Aturan Seting ZFP Menu :
var zfpm_colorTheme = 'light'; pilihan: 'dark' atau 'light'.
var zfpm_customBackgroundImage = ' '; pilihan : full URL of an image.
var zfpm_customBackgroundColor = ' '; pilihan: contoh: '#999999'.
var zfpm_shareBox = 'yes'; pilihan: 'yes' atau 'no'.
var zfpm_shareBoxPosition = 'right'; pilihan: 'left' atau 'right'.
var zfpm_shareBoxCustomWidth = ' '; pilihan: contoh: '300'.
var zfpm_waitForPageLoad = 'yes'; pilihan: 'yes' atau 'no'.

Pemasangan menu :
Ganti ( # ) dengan url/link tujuan

Contoh barang.. : 

Sekian postingan dari saya, semoga bermanfaat dan terimakasih telah berkunjung.