Tips : Add a menubar to your Blog

Ingin menambahkan sebuah menubar di bagian atas header anda?? saya akan memberikan sebuah tutorial yang akan membahas bagaimana menambahkan menubar ke dalam new template anda.












Pada gambar diatas bisa anda lihat bahwa ada tambahan menubar yang letaknya berada diatas dan bawah header. Silhakan tambahkan code yang berwarna merah ke template anda.

<div id="'header-wrapper'">

<b:section class="'menubar'" id="'menubar'" maxwidgets="'1'" showaddelement="'yes'">

<b:widget id="'LinkList2'" locked="'true'" title="'Menubar'" type="'LinkList'/">

</b:section>

<b:section class="'header'" id="'header'" maxwidgets="'1'" showaddelement="'no'">

<b:widget id="'Header1'" locked="'false'" title="'Beautiful" type="'Header'/">

</b:section>

</div>

Untuk CSSnya, tambahkan CSS berikut :

#menubar h2 {display:none;}

#menubar ul {
list-style: none;
}
#menubar li {
float: left;
}

#menubar a:link, #menubar a:visited, #menubar a:hover {
padding: 5px;
display: block;
color: $headerTextColor;
}

#menubar a:hover {
background-color: $headerCornersColor;
}


Title untuk Menubar ini akan hilang, anda bisa menambahkan page element sebanyak yang anda suka.

Laptop review