Ooie minhas Mulberry's .
Eu acho que esse tutorial, é o mais procurado, então eu vou ensina-las como colocar aquele menu abaixo do cabeçalho, ele ficara mais ou menos assim :
Vamos lá.
1- Para começar vá em > Design > Editar HTML aperte CTRL+F e procure por: ]]></b:skin>
E ANTES dele cole :
/*** menu tutoriaisattitudeincluded.blogspot.com ***/
.menuattitude {
background-color: #cccccc; /*** cor do fundo ***/
float:left;
font-family:Courier;
color:#333333; /*** cor da fonte ***/
font-size: 10pt; /*** tamanho da fonte ***/
width:158px; /*** largura ***/
text-align: center; /*** posicionamento ***/
margin: 3px;
line-height:25px;
margin-bottom: 1px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
}
.menuattitude:hover {
background-color: #666666; /*** cor do fundo ***/
font-family: Courier; /*** Fonte ***/
color: #b779ff; /*** cor da fonte ***/
float:left; /*** posição do texto ***/
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
}
.menuattitude {
background-color: #cccccc; /*** cor do fundo ***/
float:left;
font-family:Courier;
color:#333333; /*** cor da fonte ***/
font-size: 10pt; /*** tamanho da fonte ***/
width:158px; /*** largura ***/
text-align: center; /*** posicionamento ***/
margin: 3px;
line-height:25px;
margin-bottom: 1px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
}
.menuattitude:hover {
background-color: #666666; /*** cor do fundo ***/
font-family: Courier; /*** Fonte ***/
color: #b779ff; /*** cor da fonte ***/
float:left; /*** posição do texto ***/
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
}
E se você quiser que seu menu fique com as bordas arredondadas MANTENHA o código em vermelho, e se você quiser que ele fique do jeito que o exemplo mostra, RETIRE-O.
Reparem que o que está de roxo, é para vocês saberem como mudar a cor do fundo, da fonte etc.
Salve.
2- Agora vá em designe > elemento de página > adicionar um Gadget (igual a imagem a seguir, clique nela para amplia-la)
Adicione > HTML/javaScript . Agora cole o seguinte código :
Adicione > HTML/javaScript . Agora cole o seguinte código :
<div class="menuattitude"><a href="LINK_DA_SUA_PÁGINA">TÍTULO_DA_PÁGINA</a></div>
<div class="menuattitude"><a href="LINK_DA_SUA_PÁGINA">TÍTULO_DA_PÁGINA</a></div>
<div class="menuattitude"><a href="LINK_DA_SUA_PÁGINA">TÍTULO_DA_PÁGINA</a></div>
<div class="menuattitude"><a href="LINK_DA_SUA_PÁGINA">TÍTULO_DA_PÁGINA</a></div>
<div class="menuattitude"><a href="LINK_DA_SUA_PÁGINA">TÍTULO_DA_PÁGINA</a></div>
Faça as alterações conforme pede, mantenha ''as aspas'' ao colocar os links das paginas.
Bom, é isso, espero ter ajudado e espero que tenha dado certo, qualquer coisa é só colocar as dúvidas nos comentários. Kiss