Navigasi Menu Horizontal

Mungkin Bli sudah mengerti dengan melihat gambar ini yang akan kita buat di artikel ini. Oke langsung saja kita lakukan caranya sebagai berikut.

Sekarang Bli masuk ke ID Blogger dulu. Setelah itu masuk ke Tata Letak, klik Edit HTML dan jangan lupa centang Expand Template Widgets.

Letakan Kode Berikut ini di atas kode ]]></b:skin>

/*-- (Menu/Nav) --*/
#nav{background:#000; height:30px; padding:5px 0 0; margin-bottom:0px; -moz-border-radius-bottomright:5px; -moz-border-radius-bottomleft:5px; -moz-border-radius-topright:5px; -moz-border-radius-topleft:5px}
#nav-left{float:left; display:inline; width:700px}
#nav ul{position:relative; overflow:hidden; padding-left:0px; margin:0; font:13pt comic sans ms,arial,sans-serif}
#nav ul li{float:left; list-style:none}
#nav ul li a, #nav ul li a:visited{display:block; color:#fff; margin:0 5px; padding:5px 4px; text-decoration:none}
#nav ul li a:hover{color:#800000; background-color:#fff; margin:0 5px; padding:5px 4px}
#nav ul li a.current, #nav ul li a.current:visited, #nav ul li a.current:hover{margin:0 8px; background-color:#fff; color:#fff; padding:5px 7px}

Kamudian letakkan kode berikut ini tepat dibawah kode <div id='outer-wrapper'><div id='wrap2'> kode ini biasanya letaknya dibawah <body>

<div id='nav'>
<b:section class='header-tabs' id='header-tabs' preferred='yes' showaddelement='no'>
<b:widget id='LinkList1' locked='true' title='Top Tabs' type='LinkList'>
<b:includable id='main'>
<div class='widget-content'>
<b:if cond='data:title'/>
<div id='nav-left'>
<ul>
<li><a href='/'>Home</a></li>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>
</div>
</div>
</b:includable>
</b:widget>
</b:section>
</div>

Jangan lupa Simpan Template

Jika berhasil Menu Navigasi Horizontal ini akan terdapat di posisi di atas header. Jika ingin meletakan di bawah header maka yang harus Bli lakukan adalah merubah letak posisi <div id='outer-wrapper'><div id='wrap2'>, cut dan paste seletah code header atau jika bingung maka letakan saja tepat di atas kode

<div id='content-wrapper'>
<div id='crosscol-wrapper' style='text-align:center'>
<b:section class='crosscol' id='crosscol' showaddelement='no'/>
</div>

selesai waduuh capek nie nulis script selesai juga semoga berhasil Bli, waduh ada yang lupa nich maaf ini ngambil gambar dari blog urang gak bilang bilang lupa lagi situsnya kalau kebetulan yang mengunjungi blog saya nie yang punya gambar mohon maaf terimakasih

1 komentar:

Unknown mengatakan...: -Sportsbook bonus 10% (New Member) dan 5% depo berikut nya (SBO,IBC,368Bet,AFB).
-Casino Online Bonus 5% (New Member)
-Tangkas Bonus First Depo 10%...
-Bonus referal hingga 7% untuk Sporstbook,Casino-Special Bonus referal 1,5% Hingga seumur hidup.
-Semua produk kami memiliki pasaran grade A dan dapatkan jg cashback hingga 10% hanya di master303.

Untuk Informasi lebih jelas nya silahkan hubungi CS kami Di :
*YM : cs1.master303@yahoo.com
*Wchat : Master303agent
*PIN BB : 2B3C6D8B
*SMS : 63977 153 0472

WWW.MASTER303.COM; 24 Maret 2015 pukul 00.03