Menu Horizontal 1º A primeira parte do código deve ser colocada de preferência logo depois de tudo que se refere a header.Então vá até o c...
Menu Horizontal
1º A primeira parte do código deve ser colocada de preferência logo depois de tudo que se refere a header.Então vá até o codigo do seu template e procure pelo seguinte codigo:/* Header
-----------------------------------------------
*/
#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}
#header-inner {
background-position: center;
margin-$startSide: auto;
margin-$endSide: auto;
}
#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}
#header h1 {
margin:5px 5px 0;
padding:15px 20px .25em;
line-height:1.2em;
text-transform:uppercase;
letter-spacing:.2em;
font: $pagetitlefont;
}
#header a {
color:$pagetitlecolor;
text-decoration:none;
}
#header a:hover {
color:$pagetitlecolor;
}
#header .description {
margin:0 5px 5px;
padding:0 20px 15px;
max-width:700px;
text-transform:uppercase;
letter-spacing:.2em;
line-height: 1.4em;
font: $descriptionfont;
color: $descriptioncolor;
}
#navigation{
height:40px;
width: 890px;
line-height:2.9em;
margin:-12px 10px 10px 5px;
background: url(ENDEREÇO DA SUA IMAGEM) repeat-x;
}
#navigation li{
float:left;
list-style-type:none;
border-right:1px solid #787878;
white-space:nowrap;
}
#navigation li a{
display:block;
padding:0 10px;
font-size:0.8em;
font-weight:normal;
text-transform:uppercase;
text-decoration:none;
background-color:inherit;
color: #000000;
}
* html #navigation a {width:1%;}
#navigation .selected,#navigation a:hover{
background:#808080;
color:#000000;
text-decoration:none;
}
2ºAgora adicione o codigo em vermelho como mostra o exemplo acima.
3ºAgora vamos ao segundo codigo,encontre o seguinte trecho no codigo do seu template:
<body>
<div id='outer-wrapper'><div id='wrap2'>
<!-- skip links for text browsers -->
<span id='skiplinks' style='display:none;'>
<a href='#main'>skip to main </a>
<a href='#sidebar'>skip to sidebar</a>
</span>
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='false' title='TPBB (Header)' type='Header'/>
</b:section>
</div>
<!-- Não esqueça de colocar aqui os seus links!!-->
<div id='navigation'>
<ul>
<li><a href='inserir link do seu blog' title=''>Home</a></li>
<li><a href='inserir link aqui' title=''>Artigos</a></li>
<li><a href='inserir link aqui' title=''>Fotos</a></li>
<li><a href='inserir link aqui' title=''>Links</a></li>
<li><a href='inserir link aqui' title=''>Forum</a></li>
<li><a href='inserir link aqui' title=''>Outros Sites</a></li>
<li><a href='inserir link aqui' title=''>FAQ</a></li>
<li><a href='inserir link aqui' title=''>Contato</a></li>
</ul>
</div>
4ºAdicione o codigo vermelho como aparece no exemplo acima.Onde esta 'insirir link aqui' é onde você irá colocar os links.E as partes em amarelo do codigo acima você pode mudar de nome pelo que você quer que apareça.
.png)
