Pasang Menu-Bar Blog simpel dan mudah

Hasil pengalaman sendiri setelah searching di Google dengan kata kunci "Membuat Menu-bar Blog" kebanyakan isi artikel sama (copas). Isi artikel petunjuk untuk "membuat menu-bar" sedikit membingungkan kalo orang yang mencari Tips seperti ini belum pengalaman. Biasanya suruh cari kode A (misal) dan copy paste code HTML menu-bar di atas Code A.  Dan setelah coba di Tampilan Blog baru,, kode yang disediakan untuk di pasang pada menu HTML Template justru tidak ditemukan. Maklum saja tampilan baru.

Nahk untuk mensiasati kode yang sulit dicari pada tampilan Blogger Baru, kali ini saya akan berbagi Tips untuk membuat meu-bar dengan cara simpel. TAk usah masuk pada menu HTML Template.

1. Cukup buka/ Login Blog anda
2. Masuk beranda blog
3. Pilih "Tata Letak"
4. Klik HTML Java Script pada bagian atas Kotak Artikel, seperti gambar di bawah ini   
    
5.  Klik saja,, dan akan terbuka page kecil seperti ini , pilih HTML/JavaScript       ------------------  

6. Setelah itu,,, copy dan paste code dibawah ini...                                                                          

<style type="text/css"> div.TabView div.Tabs a { float: left; display: block; width: 137px; /* Lebar Kotak Tab */ height: 22px; /* Tinggi Menu Utama Atas */ text-align: center; /* Posisi Teks Menu Tab */ margin: 1px 0px 0px 1px; /* Posisi Kotak Tab */ background-color:green; /* Warna background Kotak Tab */ padding-top: 1px; /* Spasi Atas */ border: 0px color:none; /* Warna border kotak Tab */ border-bottom: 0px color:none; /*Warna border bawah kotak tab */ font-family: "Arial, Helvetica, sans-serif", Arial; /* Font Kotak Tab */ font-weight: 900; /* Ketebalan Teks kotak tab */ } div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active { background-color:black; /* Warna background utama kotak tab */ } div.TabView div.Pages { clear: both; border: 1px ,color:blue /* Warna border Kotak Konten */ overflow: unhidden; background-color: blue; /* Warna background Kotak konten */ } div.TabView div.Pages div.Page { height: 100%; padding: 0px; /* Jarak teks dalam kotak content */ overflow: none; } div.TabView div.Pages div.Page div.Pad { padding: 0px 0px; } </style> <form action="tabview.html" method="get"> <div id="TabView" class="TabView"> <div style="width: 1000px;" class="Tabs"> <!--tulisan menubar-->

<a a href="http://cobakasihtahu.blogspot.com/"><span style="color: white">HOME</span></a>

<a a href="http://cobakasihtahu.blogspot.com/"><span style="color: white">Tutorial</span></a>

<a a href="http://cobakasihtahu.blogspot.com/"><span style="color: white">IKLAN</span></a>

<a a href="http://cobakasihtahu.blogspot.com/"><span style="color: white">Contac</span></a> </div></div></form>

1. Setelah itu ,,,, Ganti tulisan berwarna BIRU dengan link sobat,,, dan Ganti tulisan berwarna KUNING dengan Title yang anda  inginkan,,,
2. Klik simpan...
3. Menu-bar sudah tercipta,,,, anda juga bisa ganti warna menu-bar dengan mengganti code warna pada code HTML yang saya berikan.
4. Selesai :D

Semoga bermanfaat,,, mudah itu simpel,, berbagi itu indah :D