Tutorial: Menu Ioiô



Queria pedir desculpas a vocês e à Ingrid pela semana ausente. Hoje foi uma correria, e tinha me esquecido que é meu dia de postar! Então trouxe um tutorial de um menu muito fofo, que pretendo usar em um lay free. Clique em Leia mais e aprenda a colocar!

Visualize o menu: (x)


Primeiro vá em Modelo >> Editar HTML >> Prosseguir >> Dê Ctrl+F e procure por:

]]></b:skin>

Achou? Então cole antes dele:

}
.mennu {
font-family: verdana;
width: 60px;
height:15px;
float: left;
background: #e3c7f3; /* Cor do fundo*/
padding: 5px;
text-align: center;
text-shadow: 0 0px 0px #000; /* Cor da sombra*/
margin: 3px; 10px;
font-size: 9pt; /* Tamanho da fonte */
color: #777; /* Edite a cor da fonte */
border-radius:1px;
border-top: 2px solid #eee;
border-bottom: 2px solid #eee;
-webkit-transition-duration: .99s;
-moz-transition-duration: .99s;
}
.mennu:hover {
background: #ccacde; /* Fundo hover */
border-top: 2px solid #eee;
border-bottom: 2px solid #eee;
-webkit-transform: translate(2px, -51px);
-moz-transform: translate(2px, -51px);
-o-transform: translate(2px, -51px);
-webkit-transition-duration: .99s;
-moz-transition-duration: .99s;
}

Agora vá em >> Layout >> Adicionar um Gadget >> HTML/Javascript e cole:

<a href=" ENDEREÇO DO LINK"class="mennu"> <div style="color: #fff;">NOME DO LINK</div></a>
<a href=" ENDEREÇO DO LINK"class="mennu"> <div style="color: #fff;">NOME DO LINK</div></a>
<a href=" ENDEREÇO DO LINK"class="mennu"> <div style="color: #fff;">NOME DO LINK</div></a>
<a href=" ENDEREÇO DO LINK"class="mennu"> <div style="color: #fff;">NOME DO LINK</div></a> 
(Personalize as partes em negrito)

Bem simples! achei ele muito fofo, gosto muito de menus, mesmo que eu não use muito, sempre procuro por novos. Bem, espero que tenham gostado! Qualquer dúvida, comente!

Créditos:  

Malikisses Xx

11 comentários:

  1. *O* Adorei o menu!! Super lindo esse efeito! Beijos

    Explodindo Glitter, no perfil

    ResponderExcluir
  2. Hihi* Polly, que menu fofo! *u*

    Já vou usar no layout free que estou terminando para a semana de utilitários. Adorei o tutorial. ^-^

    Meu Mundinho Colorido ~

    ResponderExcluir
  3. Que lindo.Tava procurando um para o meu novo layout !Acho que vou usar esse :3

    corderosa.tk

    ResponderExcluir
  4. Vi esse menu esses dias, ele é diverente mesmo, e lindo também. Beijos,
    Adolescentes do oposto (blog no perfil)

    ResponderExcluir
  5. sindo esse menu! amei!
    Amora Azeda

    ResponderExcluir
  6. aii que liiindo ameeeeeei <3
    Nois Conectados

    ResponderExcluir
  7. Ameei ! Fiica subindo e descendo [não biiah , descobriu isso sozinha?] ..kk ' ameei ! rs '
    Smile Fake

    ResponderExcluir
  8. O menu é legal, só não saberia onde colocar hehe ♥
    omeubrilhantemundo.tk

    ResponderExcluir
    Respostas
    1. Eu colocaria na sidebar, ou acima da área dos posts. Dependendo da quantidade de links (se forem bastante) eu colocaria debaixo do cabeçalho!
      hehe' :3
      Xx

      Excluir
  9. Amei esse menu (: '
    Sigam meu blog , fiz ele a poco tempo.
    http://enfoldteen.blogspot.com.br/

    ResponderExcluir

Obrigada pelo seu comentário, sua opinião é muito importante!
Se seu perfil for trancado, não se esqueça de deixar o link do seu blog ou pelo menos o nome, para que eu possa retribuir. ♥

« » +