Hey, docinhos e docinhas.
Hoje eu trouxe um menu que achei muito legal já usei aqui no blog na página de
goodies, mas não uso mais.
É esse que está nessa
imagem abaixo.
Primeiro vá em Modelo>> Editar HTML>> Aperte Ctrl+F
e procure por
]]></b:skin>
Quando achar cole o
seguinte código ACIMA da tag.
.fortutos a {
display : block;
font-family: 'silkscreen';
margin: 1px;
text-transform: uppercase;
font-size: 10px;
color:#fff;
border-left:6px solid #97b1c1;
background:#c8d6de;
text-shadow: 1px 1px 1px #b0c4cf;
padding: 5px 10px 3px 3px;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all 0.4s ease;}
.fortutos a:hover{
padding-left: 13px;
border-left:6px solid #668ca4;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all 0.4s ease;}
Edite e salve. Agora para
o menu aparecer, crie uma nova página e no HTML da página cole:
<div class="fortutos">
<a href="LINK"> TUTORIAL </a></div>
<div class="fortutos">
<a href="LINK"> TUTORIAL </a></div>
<div class="fortutos">
<a href="LINK"> TUTORIAL </a></div>
<div class="fortutos">
<a href="LINK"> TUTORIAL </a></div>
<div class="fortutos">
<a href="LINK"> TUTORIAL </a></div>
Mude somente onde
está destacado. LINK é a URL do
tutorial e TUTORIAL é o nome do
título.
Espero que tenham
gostado!