Trazendo um novo estilo de menu ,que resulta e fica bem em certos templates.
Na imagem acima mostra como fica têm hover nos botões ao passar o mouse.
Este menu ele acerta a largura do seu template desde área dos posts até sidebar,veja o menu online;
ENTRE AQUI...
Para adicionar este menu vá em esquema e depois adicione um gadget html/javascript e cole meu código;
<style>Simples de aplicár .
#btMenucool {
background:#ffc0cb;
height: 30px;
margin:0px 0 0 0;
padding:25px 0 0 ;
-moz-box-shadow: 0px 1px 9px #bf6bdb;
-webkit-box-shadow: 0px 1px 9px #bf6bdb;
box-shadow: 0px 1px 9px #bf6bdb;
}
ul.bttop {
margin:0;
padding:0;
list-style:none;
}
ul.bttop li {
margin:0;
padding:0;
list-style:none;
display:inline;
}
ul.bttop li a {
padding:8px;
font:bold 18px bobber;
text-decoration:none;
color:#000;
background:#ff77aa;
}
ul.bttop li a:hover {
background:#e3c6f4;
color:#3e3a3a
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-moz-box-shadow: 0px 1px 9px #2e2c2e;
-webkit-box-shadow: 0px 1px 9px #2e2c2e;
box-shadow: 0px 1px 9px #2e2c2e;
}
ul.bttop li a.active {
background:#e3c6f4;
color:#3e3a3a;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
padding:9px;
font:bold 18px bobber;
text-decoration:none;
}
</style>
<div id="btMenucool">
<ul class="bttop">
<li><a href="seu link" class="active">BOTÃO1</a></li>
<li><a href="seu link"> BOTÃO2</a></li>
<li><a href="seu link"> BOTÃO3</a></li>
<li><a href="seu link"> BOTÃO4</a></li>
<li><a href="seu link"> BOTÃO5</a></li>
</ul>
</div>
Nota; onde diz seu link vc coloca o link respectivo a cada botão...
Foi mais uma partilha ,espero que seja útil até mais.
Mostra SmilesOculta Smiles