Memasang Tab Menu Horizontal Bag 2

Tulisan ini lanjutan dari postingan sebelumnya, jadi sangat di sarankan bagi yang bloem mengetahui bagian pertama tentang Memasang Tab Menu Horizontal  untuk membacanya ( lihat di sini ). Bagi yang sudah membacanya mari kita lanjut.

Perlu di ketahui sebenarnya pemasangan Tab Menu di blog kita bisa juga di lakukan tampa penambahan sebuah widget html/javascrip. ( baca bagian pertama langkah ke enam ).

Langkah-langkahnya seperti berikut ini.

Pertama : Dalam Template klik tulisan Edit Html. kemudian cari kode di bawah ini.

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='3' showaddelement='yes'>
<b:widget id='Header1' locked='true' title='bikin tiga kolom (Header)' type='Header'/>
</b:section>
</div>

Setelah itu masukan kode html Tab Menu diakhir tag penutup bagian kode div id "header-wrapper " di atas. seperti tulisan merah yang di tunjukan di bawah ini .

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='3' showaddelement='yes'>
<b:widget id='Header1' locked='true' title='bikin tiga kolom (Header)' type='Header'/>
</b:section>
<ul id='menu'>
<li><a class='current' href='http://www.jaloee.blogspot.com'>home</a></li>
<li><a
href='http://http://jaloee.blogspot.com/search/label/Photo'>Photo</a></li>
<li><a href='http://http://www.blogger.com/'>login</a></li>
</ul>
</div>

Kemudian SIMPAN TEMPLATE .

dan lihat hasilnya di Elemen Halaman. akan sangat berbeda dengan cara pertama.

Dan bagaimana kalau Tab Menu-nya ingin terlihat dan posisinya berada di atas Header. Caranyapun sangat mudah. Masukan saja Code Html Tab Menu-nya di atas tulisan div id 'header-wrapper'. seperti di tunjukan di bawah ini.

<ul id='menu'>
<li><a class='current' href='http://www.jaloee.blogspot.com'>home</a></li>
<li><a
href='http://http://jaloee.blogspot.com/search/label/Photo'>Photo</a></li>
<li><a href='http://http://www.blogger.com/'>login</a></li>
</ul>
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='3' showaddelement='yes'>
<b:widget id='Header1' locked='true' title='bikin tiga kolom (Header)' type='Header'/>
</b:section>
</div>

Kemudian SIMPAN TEMPLATE

Sebenarnya masih ada cari lain lagi untuk menambah dan memasukan Tab Menu ini. Mudah-mudahan dalam kesempatan lain saya akan menunjukannya.

Technorati tags: belajar blogs, new blogger