Tips n' Trik - Membuat Menu Horisontal di Blogspot Terbaru
Membuat Menu Horisontal di Blogspot Terbaru - Gimana yah tulis tutorialnya ?? hehehehe maklum tutorial pertama yg asli di tulis dgn tangan sendiri... biasa sih copas (akakakakakka) aaahhhh capek basa basih lagi... langsung ajha ke tutornya
Persiapan :
- Keahlian
- Kesabaran
- 1 bungkus Rokok
- Teh/ Kopi Hangat
Langsung ajha deh,,,
Tahap 1
- Masuk Ke Bloger
- Pilih Rancangan
- Edit HTML
- Jangan Lupa Backup templatenya
- Centang Expand Template Widget bisa jga ngga sih (hahaha)
Cari Kode <head> Kemudian copy javascript dibawah ini tepat di bawah kode <head> !!
<link href='https://sites.google.com/site/sonderberbagi/menu-blog-sonder-berbagi/menu.css' rel='stylesheet' type='text/css'/>
<script src='https://sites.google.com/site/sonderberbagi/menu-blog-sonder-berbagi/jquery.js' type='text/javascript'/>
<script src='https://sites.google.com/site/sonderberbagi/menu-blog-sonder-berbagi/menu.js' type='text/javascript'/>
Tahap 2
- Masuk Ke Bloger
- Pilih Rancangan
- Elemen Halaman
- Tambah Gadget pilih HTML
<div id="menu">
<ul class="menu">
<li><a href="#" class="parent"><span>Home</span></a>
<div><ul>
<li><a href="#" class="parent"><span>Sub Item 1</span></a>
<div><ul>
<li><a href="#" class="parent"><span>Sub Item 1.1</span></a>
<div><ul>
<li><a href="#"><span>Sub Item 1.1.1</span></a></li>
<li><a href="#"><span>Sub Item 1.1.2</span></a></li>
</ul></div>
</li>
<li><a href="#"><span>Sub Item 1.2</span></a></li>
<li><a href="#"><span>Sub Item 1.3</span></a></li>
<li><a href="#"><span>Sub Item 1.4</span></a></li>
<li><a href="#"><span>Sub Item 1.5</span></a></li>
<li><a href="#"><span>Sub Item 1.6</span></a></li>
<li><a href="#" class="parent"><span>Sub Item 1.7</span></a>
<div><ul>
<li><a href="#"><span>Sub Item 1.7.1</span></a></li>
<li><a href="#"><span>Sub Item 1.7.2</span></a></li>
</ul></div>
</li>
</ul></div>
</li>
<li><a href="#"><span>Sub Item 2</span></a></li>
<li><a href="#"><span>Sub Item 3</span></a></li>
</ul></div>
</li>
<li><a href="#"><span>Product Info</span></a>
<div><ul>
<li><a href="#" class="parent"><span>Sub Item 1</span></a>
<div><ul>
<li><a href="#"><span>Sub Item 1.1</span></a></li>
<li><a href="#"><span>Sub Item 1.2</span></a></li>
</ul></div>
</li>
<li><a href="#" class="parent"><span>Sub Item 2</span></a>
<div><ul>
<li><a href="#"><span>Sub Item 2.1</span></a></li>
<li><a href="#"><span>Sub Item 2.2</span></a></li>
</ul></div>
</li>
<li><a href="#"><span>Sub Item 3</span></a></li>
<li><a href="#"><span>Sub Item 4</span></a></li>
<li><a href="#"><span>Sub Item 5</span></a></li>
<li><a href="#"><span>Sub Item 6</span></a></li>
<li><a href="#"><span>Sub Item 7</span></a></li>
</ul></div>
</li>
<li><a href="#"><span>Help</span></a></li>
<li class="last"><a href="#"><span>Contacts</span></a></li>
</ul>
</div>
NB :
Tanda # Silakan ganti dgn URL tujuan kalian
Sub Item = Nama URL Tujuan
Mau Liat Yang sudah jadi ada disini gan
0 komentar:
Post a Comment