Membuat Menu di Bawah Header / Judul Blog

Bagi rekan blogger yang menggunakan template yang belum difasilitasi dengan menu horisontal dibawah header pada blognya, 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...



Update Okt-2013 !!
Langsung pergi menuju Layout--Add a Gadget(pilih yang berada dibawah header/diatas post body)--HTML/Javascript , copy kode dibawah ini..

<style>
/* -- Menu Horizontal + Sub Menu-- */
#cat-nav { background :silver repeat-x bottom left;margin:0 px;padding:0;height:35px;}
#cat-nav a { color:black; text-decoration:none; text-shadow: #000000  0px 0px 0px;border-right:1px solid  white;}
#cat-nav a:hover { color:#000; }
#cat-nav li:hover { background:#bbb repeat-x; }
#cat-nav a span { font-family:Verdana, Geneva, sans-serif; font-size:11px; font-style:normal; font-weight:400; color:#fff; text-shadow:none;}
#cat-nav .nav-description { display:block; }
#cat-nav a:hover span { color:#fff; }
#secnav, #secnav ul { position:relative; z-index:100; margin:0; padding:0; list-style:none; line-height:1; background:#ddd; }
#secnav a { font-family:Trebuchet MS; font-style:none; font-weight:700; font-size:15px; display:block; z-index:100; padding:0 10px; line-height:35px; text-decoration:none;}
#secnav li { float:left; width: auto; height:35px;}
#secnav li ul  { position: absolute; left: -960em; width: 170px; top:35px}
#secnav li ul li  { height:30px; border-top:1px solid #fff; }
#secnav li ul li a  { font-family: Verdana, Geneva, sans-serif; width:150px; line-height:30px; padding:0 10px; font-size:13px; font-style:bold ; font-weight:400; color:black; }
#secnav li ul ul  { margin: -30px 0 0 180px; }
#secnav li:hover ul ul, #secnav li:hover ul ul ul, #secnav li.sfhover ul ul, #secnav li.sfhover ul ul ul { left:-960em; }
#secnav li:hover ul, #secnav li li:hover ul, #secnav li li li:hover ul, #secnav li.sfhover ul, #secnav li li.sfhover ul, #secnav li li li.sfhover ul { left: auto; }
#secnav li:hover,#secnav li.hover  { position:static; }
#cat-nav #secnav {width:100%;margin: auto;}
</style>
<div id='cat-nav'>
<ul class='fl' id='secnav'>
<li><a href='http://# '>Beranda</a></li>
<li><a href='http://# ' target='_blank'>MENU 1</a>
<ul id='sub-custom-nav'>
<li><a href='http://# ' target='_blank'>SUB MENU1</a></li>
<li><a href='http://# ' target='_blank'>SUB MENU2</a></li>

</ul>
</li>
<li><a href='http://# ' target='_blank'>MENU2</a>
<ul id='sub-custom-nav'>
<li><a href='http://# ' target='_blank'>SUB MENU2.1</a></li>
<li><a href='http://# ' target='_blank'>SUB MENU2.2</a></li>
</ul>
</li>
<li><a href='http://# ' target='_blank'>MENU3</a>
<ul id='sub-custom-nav'>
<li><a href='http://# ' target='_blank'>SUB MENU3.1</a></li>
<li><a href='http://# ' target='_blank'>SUB MENU3.2</a></li>
</ul>
</li>

<li><a href='http://# ' target='_blank'>MENU4</a>
<ul id='sub-custom-nav'>
<li><a href='http://# ' target='_blank'>SUB MENU4.1</a></li>
<li><a href='http://# ' target='_blank'>SUB MENU4.2</a></li>
</ul>
</li>

<li><a href='http://# 'target='_blank'>MENU5</a><ul id='sub-custom-nav'>
<li><a href='http://# 'target='_blank'>SUB MENU5.1</a></li>
<li><a href='http://# 'target='_blank'>SUB MENU5.2</a></li>
</ul>
</li>

<li><a href='http://# 'target='_blank'>MENU6</a><ul id='sub-custom-nav'>
<li><a href='http://# 'target='_blank'>SUB MENU6.1</a></li>
<li><a href='http://# 'target='_blank'>SUB MENU6.2</a></li>
</ul>
</li>
<li><a href='http://# 'target='_blank'>MENU7</a><ul id='sub-custom-nav'>
<li><a href='http://# 'target='_blank'>SUB MENU7.1</a></li>
<li><a href='http://# 'target='_blank'>SUB MENU7.2</a></li>
</ul>
</li>
<li><a href='http://www.masbugie.com' rel='dofollow' target='_blank'>About Me</a>
<ul id='sub-custom-nav'>
<li><a href='http://id-id.facebook.com/people/Bugie-Down/1359919635' rel='dofollow' target='_blank'>FACEBOOK</a></li>
<li><a href='http://twitter.com/masbugie' rel='dofollow' target='_blank'>TWITTER</a></li>
</ul></li></li></li></ul></div>

*Alamat url diatas silahkan sesuaikan dengan blog Anda dan teks warna biru sesuaikan dengan selera.

Lebar kotak pada menu sudah saya setting menyesuaikan dengan panjang tulisan pada menu beroo.