Membuat Menu di Bawah Header / Judul Blog

Bagi rekan blogger yang menggunakan template yang belum difasilitasi dengan menu horisontal dibawah header pada blognya,dibawah Ini contoh gambarnya

berikut saya postkan bagaimana cara membuat menu tersebut. Fungsi dan kegunaan menu ini adalah agar memudahkan kita dalam menelusuri semua isi yang terkandung didalam blog tersebut (baca: easy to navigate) .Yuk kita mulai...

Hal pertama yang harus dilakukan adalah login ke blogger > Layout/Tata Letak > Edit Html .

Selanjutnya Anda cari kode dibawah ini, untuk mempermudah pencarian silahkan gunakan CTRL+F

showaddelement='no'

Anda ubah kode showaddelement='no' menjadi showaddelement='yes' , kalau sudah klik simpan ya

Setelah yang pertama sudah disimpan, sekarang klik Page elements / Elemen Laman > Tambah Gadget > HTML/Javascript , copy kode dibawah ini,simpan dan letakan tepat dibawah header.

Untuk menambah gadget dibawah header bisa baca disini

<a href="http://bloggerbintang.blogspot.com " class="navigation">HOME</a>
<a href="http://bloggerbintang.blogspot.com/search/label/Online/search?max-results=200 " class="navigation">Radio Online</a>
<a href="http://bloggerbintang.blogspot.com/2011/04/mnctvrctisctvbinustvglobaltvantvtvoneme.html " class="navigation">Tv Online</a>
<a
href="http://meteorkazama.blogspot.com/ " class="navigation">Info Bola</a>
<a href="http://bloggerbintang.blogspot.com/2011/04/music-play.html " class="navigation">Music Play</a>
<a href="http://bloggerbintang.blogspot.com/2011/04/compress-html " class="navigation">Compress HTML</a>
<a href="http://bloggerbintang.blogspot.com/2011/04/chatting-admin.html " class="navigation">CHATTING</a>

Warna Merah (URL) ganti dengan Url sobat, untuk mengetahui Url sobat, misalkan pada Label, Klik kanan Lalu Copy Link Location
Warna Biru adalah judul yang akan tampil, bisa diganti sesuka sobat

Hal ketiga adalah supaya menu itu menimbulkan efek warna sehingga menjadi kelihatan menarik.

Klik Tata Letak > Edit HTML , cari kode , agar mudah gunakan tombol CTRL+F

Copy kode dibawah ini dan letakan tepat diatas kode kemudian simpan.

a.navigation {
background: #3333ff ;
color: #ffffff;
margin: 1px;
padding: 2px;
border-width: 0;
text-transform: uppercase;
text-decoration: none;
font-weight: bold;
}
a.navigation:hover {
background: #333333;
color: #ffffff;
text-decoration: none;
}