Para evitar problemas caso ocorra algum erro durante este procedimento sugiro que faça um back up do seu templates clique aki caso não saiba como Clique aqui.
Prontos pra começar então vamos la.
Va para a pagina Editar Html do seu blog, localize o trecho ]]></b:skin> . Encima desse trecho cole o codigo 1.
Codigo 1
/*Inicio Menu Horizontal---*/
#menuhorizontal{ /* não altere */ }
ul#navlist
{
margin: 0;
padding: 0;
list-style-type: none;
white-space: nowrap;
}
ul#navlist li
{
float: left;
font-family: verdana, arial, sans-serif;
font-size: 10;
font-weight: bold;
margin: 1;
padding: 5px 0 4px 0;
background-color: #00008B;
border-top: 2px groove #cccccc;
border-bottom: 1px groove #ffffff;
}
#navlist a, #navlist a:link
{
margin: 0;
padding: 5px 9px 4px 9px;
color: #ffffff;
border-right: 2px groove #cccccc;
text-decoration: none;
}
ul#navlist li#active
{
color: #000000;
background-color: #cccccc;
}
#navlist a:hover
{
color: #ffffff;
background-color: #000000;
}
/*---fim do Menu Horizontal---*/
Vamos pra ultima parte:
Clique na imagem para ampliar
Feito isso procure agora por <div id='header-wrapper'> um pouco abaixo desse trecho cole o codigo 2 entre as tags:
</b:section>
</div>
Amplie a figura acima para localizar o local exato onde deve inserir o codigo 2
Codigo 2
<div id="menuhorizontal">
<li id="active"><a href="AQUI O ENDEREÇO DO SEU LINK" id="current">LINK 1</a></li>
<li><a href="ENDEREÇO DO SEU LINK">LINK 2</a></li>
<li><a href="ENDEREÇO DO SEU LINK">LINK 3</a></li>
<li><a href="ENDEREÇO DO SEU LINK">LINK 4</a></li>
<li><a href="ENDEREÇO DO SEU LINK">LINK 5</a></li>
<li><a href="ENDEREÇO DO SEU LINK">LINK 6</a></li>
<li><a href="ENDEREÇO DO SEU LINK">LINK 7</a></li>
<li><a href="ENDEREÇO DO SEU LINK">LINK8/a></li> </ul>
</div>
Agora é só clicar emem salvar modelo e vizualizar como ficou. Posteriormente irei mostrar como alterar a cor dos botões e do texto dos botões.
Espero que tenha ajudado e que todos consigam.
0 comentários:
Postar um comentário