Cara memasang menu di blog

Tips And Trick Blog Comment

Cara memasang sub menu yang baik dan benar,hehehe...

Gak usah repot repot ea,

Ada dua tempat untuk memasang sub menu yang pertama di Tata Letak dan Edit HTML.

Copy dulu ini ya...

<style>

/* -- Menu Horizontal + Sub Menu-- */

#cat-nav {background:#333333;width:960px;margin:0 0px;padding:0;height:25px;border-top:1px solid #222222;}

#cat-nav a { color:#eee; text-decoration:none; text-shadow: #444444 0px 1px 0px;border-right:1px solid #222222;}

#cat-nav a:hover { color:#000; }

#cat-nav li:hover { background:#333333; }

#cat-nav a span { font-family:Verdana, Geneva, sans-serif; font-size:11px; font-style:normal; font-weight:400; color:#222222; text-shadow:none;}

#cat-nav .nav-description { display:block; }

#cat-nav a:hover span { color:#222222; }

#secnav, #secnav ul { position:relative; z-index:100; margin:0; padding:0; list-style:none; line-height:1; background:#333333; }

#secnav a { font-family:Georgia, "Times New Roman", Times, serif; font-style:Arial; font-weight:700; font-size:14px; display:block; z-index:100; padding:0 15px; line-height:25px; text-decoration:none;}

#secnav li { float:left; width: auto; height:25px;}

#secnav li ul { position: absolute; left: -999em; width: 200px; top:25px}

#secnav li ul li { height:30px; border-top:1px solid #222222; }

#secnav li ul li a { font-family:Verdana, Geneva, sans-serif; width:180px; line-height:30px; padding:0 10px; font-size:11px; font-style:normal; font-weight:400; color:#eee; }

#secnav li ul ul { margin: -30px 0 0 180px; }

#secnav li:hover ul ul, #secnav li:hover ul ul ul, #secnav li.sfhover ul ul, #secnav li.sfhover ul ul ul { left:-999em; }

#secnav li:hover ul, #secnav li li:hover ul, #secnav li li li:hover ul, #secnav li.sfhover ul, #secnav li li.sfhover ul, #secnav li li li.sfhover ul { left: auto; }

#secnav li:hover,#secnav li.hover { position:static; }

#cat-nav #secnav {width:100%;margin:0 auto;}

</style>

</ul>

</li>

</ul>

</li>

</ul>

</div>

Keterangan: (Lanjut aja dulu gan...!! ntar baru peragain keterangan nya)

· pagar(#) pada menu di atas di ganti dengan alamat post kamu.

· Pada tulisan ‘Nama Menu’di ganti dengan nama yang kamu mau,

· Menganti warna background:#333333 saya, kalo di ganti tinggal di ganti angka nya aja,kalo mau semua sekalian aja cari #333333 trus di ganti.yang kode begituan warna kok.

· Luas nya ganti aja yang: width:960px;margin:0 0px;padding:0;height:25px;border-top:1px itu di ganti ma sesukamu berapa pixel.

· Untuk menambah menu or sub menu ni dya, tambahkan kode berikut<li><a href='#'> Nama Menu</a></li> di atas kode </ul></div> jadi begini.

</ul>
</div>

· Untuk sub menu. Sisipkan kode berikut <li><a href='#'>Sub Menu</a></li> di atas </ul></li>

Kedua menu dan sub menu ini jika ingin di tambah tinggal kopi kodenya aja kode nya di taruh di atas kode penutup tadi.

Cara memasang*

ada dua gan pilih slah satu yang gampang.

1.Pasang di Edit HTML.

Klik Daftar Entri=> template=> nah tukan ada ubah sesuai trus ma Edit html. Klik yang Edit html. Trus klik Expand Template Widget-nya,,,,

Nb: cari kode ini dulu ya kalau pake template standar.

<div class='main-outer'> atau
<div id='main-wrapper'> atau
<div id='main'

Cara cepat cari kodenya? Klik aja ctrl+f.

Baru dech masukin kode di atas tadi....!!

Sebelum terjadi maslah klik petinjau dulu ya....oke...!!

2.pasang menu horizontal nya pada bagian Edit HTML silakan pasang pada Gadget/Widget (dibawah header), caranya:

Klik Tata Letak=>Klik Add Gadget=>Pilih Gadget Html/JavaScript=>Simpan=>Selesai

Makasih...jangan lupa join ya...!!

Jika salah muhon komentarnya....

Ter inspirasi dari: http://blog.ahmadrifai.net/2012/03/membuat-menu-serta-sub-menu-tanpa.html

Layar Kerja

Cara memasang menu di blog