Main Menu Bar Dengan CSS


Cara membuat menu Drop Down  dengan CSS:
Ikuti cara berikut ini:


1. Sign in di akun blogger.com Sobat


2. Pilih blog yang mau di terapkan menu ini


3. Pilih menu >>
Template (tampilan blogger diperbaharui) lalu >>Edit HTML;

4. Beri tanda centang pada tulisan >>
Expand Template Widget;

5. Carilah kode yang kurang lebih seperti berikut ini (
gunakan ctrl+F untuk mempermudah pencarian):

]]></b:skin>


Lalu pastekan Code berikut ini di atas code tersebut:



Setelah itu >> Simpan Template, dan tutup Edit Template.
Kemudian klik : Tata Letak >> Tambah Gadget/Add Gadget >> HTML/JavaScript, lalu pastekan code berikut:

<div class="nav">

<div class="table">
<ul class="select"><li><a href="#"><b>Home</b></a></li></ul>
<ul class="select"><li><a href="#"><b>Menu 1</b></a>
<div class="select_sub">
<ul class="sub">
<li><a href="#">Sub Menu 1 a</a></li>
<li><a href="#">Sub Menu 1 b</a></li>
<li><a href="#">Sub Menu 1 c</a></li>
<li><a href="#">Sub Menu 1 d</a></li>
<li><a href="#">Sub Menu 1 e</a></li>
</ul>
</div>
</li>
</ul>
<ul class="select"><li><a href="#"><b>Menu 2</b></a>
<div class="select_sub">
<ul class="sub">
<li><a href="#">Sub Menu 2 a</a></li>
<li><a href="#">Sub Menu 2 b</a></li>
<li><a href="#">Sub Menu 2 c</a></li>
<li><a href="#">Sub Menu 2 d</a></li>
<li><a href="#">Sub Menu 2 e</a></li>
</ul>
</div>
</li>
</ul>
<ul class="select"><li><a href="#"><b>Menu 3</b></a>
<div class="select_sub">
<ul class="sub">
<li><a href="#">Sub Menu 3 a</a></li>
<li><a href="#">Sub Menu 3 b</a></li>
<li><a href="#">Sub Menu 3 c</a></li>
<li><a href="#">Sub Menu 3 d</a></li>
<li><a href="#">Sub Menu 3 e</a></li>
</ul>
</div>
</li>
</ul>
<ul class="select"><li><a href="#"><b>Menu 4</b></a>
<div class="select_sub">
<ul class="sub">
<li><a href="#">Sub Menu 4 a</a></li>
<li><a href="#">Sub Menu 4 b</a></li>
<li><a href="#">Sub Menu 4 c</a></li>
<li><a href="#">Sub Menu 4 d</a></li>
<li><a href="#">Sub Menu 4 e</a></li>
</ul>
</div>
</li>
</ul>
</div>
</div>
<br />
Ket: ganti tulisan Menu 1-Menu 4 dan Sub Menu dengan Nama Menu yg sobat kehendaki
"#"
ganti dengan URL blog sobat.
Letakan gadget nya di atas atau di bawah Header Blog....dan SELESAI.

0 komentar "Main Menu Bar Dengan CSS", Baca atau Masukkan Komentar

Posting Komentar

Seorang blogger sejatinya selalu memberikan komentar yang terbaik serta membangun,terima kasih sobat atas kunjunganya.Sukses Selalu Blogger Indonesia