tutorial simple menu horizontal

kalau kemaren saya posting tutorial blogger cara pasang auto readmore yang tampil dengan gambar  dalam kesempatan ini saya akan bahas tutorial cara pasang sub menu  dimana menu semacam ini tidak disediakan oleh blogger jadi jika blog menggunakan blogger dan ingin pasang sub menu   kita harus memasangnya sendiri,
beda dengan blog..

cara pasang menu horizontal yang paling gampang dan mudah terutama buat para pemula. karena menu horizontal ini tidak perlu masuk ke edit html yang bikin bingung para pemula blogger ..

gambar di atas adalah contoh menu horizontal yang akan kita bahas dalam kesempatan ini.

postingan ini saya buat utuk memenuhi pertanyaan teman2 yang koment di fbpage kemaren yang kebingungan mencari tutorial yang mudah pasang menu horizontal sebab yang mereka tau(para blogger newbei) untuk memasang menu ini sangat sulit dan langkah langkah yang ribet alias sulit di mengengerti.

saya mencoba beberapa kali mengabungkan kode script hatml dengan kode ccs tampa masuk editor template. asumsi ini saya tujukan agar memudahkan para pemula yang ingin  menambahkan menu horizontal yang kabarnya sangat penting untuk dipasang di blog.karena menu horizontal ini harus dipasang secara manual pada template bawaan blogger.

oke mari kita mulai tutorial blogger buat pemula ini.

langkah pertama yang harus dilakukan pastinya sobat harus login dulu diblog masing masing.

-selanjutnya klik menu design->page elemen->tambah gadget

-silahkan pilih javascript/html.

-setelah itu silahkan copy paste kode dibawah ini jagan sampai ada yang terlewat

<center><div class='menu-solid'>
<a href='LINK ALAMAT BLOG ANDA DISINI'>Home</a>
<a href='LINK MENU 1'>tukar link</a>
<a href='LINK MENU 2'>tutorial</a>
<a href='LINK MENU 3'>forum</a>
<a href='LINK MENU 4'>daftar isi</a>
<a href='LINK MENU 5'>download</a>

</div> </center>
<div style="text-align: right; font-size: 7px;">
              by
             <a href='http://www.rajacolek.co.cc' target='_blank'>rajacolek</a>
          </div>
<style>
/* horizontal menu CSS
------------------------------------------- */

/*Credits: menu by rajacolek*/

.menu-solid{
margin: 0;
padding: 0;
float: left;
font: bold 12px Arial;
width: 100%;
border: 1px solid #6e2f12;
border-width: 1px 0;
-moz-border-radius: 10px;
border-radius: 10px;
background: #000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcAmAJ2w4_q-jFsyjnAIT_zmj1_wQWiPOdvi1zFGMj1SWcwXTHYDsY7KQkSsxG7Wp1egPHb9xvCxQMrWZiYzmDjd5r8-GLgEQROM5eh9K9n-GQfFvFyAMIZhRGyP1yBPDIipUbx-KyPjm_/s1600/menu.png);
}
.menu-solid {
display: inline;
}
.menu-solid a{
float: left;
color: white;
padding: 9px 11px;
text-decoration: none;
}
.menu-solid a:visited{
color: #ffffff;
}

.menu-solid a:hover, .menu-solid .current{
color: #000;
background: #f3f3f3;
text-decoration:none;
}

</style>

- langkah terahir silahkan klik simpan


KETERANGAN:


 silahkan ganti semua yang saya beri warna merah dengan link/URL menu sobat..

dan ganti pula teks yang saya beri warna biru dengan judul menu sobat...

selesai...
semoga dapat dimengerti dan selamat mencoba moga berhasil..salam sejatera.....