Menu Status


  Olá pessoal, ontem não deu para eu postar mais hoje estou aqui né, vou procurar sempre postar..um dos motivos de eu não postar é o senso de falta de criatividade, creio que, sem criatividade nem adianta criar não?! Enfim, hoje estou trazendo um menu perfeito para vocês, ele está sendo muito utilizado ultimamente, acho ele muito bonito, mesmo não usando aqui no eJhonas, então, chega de papo, vamos começar fazendo?

 Vá em Designer  Editar HTML  Expandir Modelo de Widgets  Ctrl + F (Procure por:)
]]></b:skin>
Achou? Acima desta tag, cole este código:
.wishlist {
background: #eee;
font-family:  Verdana;
font-size: 8px;
margin: 1px;
color: #444444;
display: block;
-moz-box-shadow: inset 3px 0 0px 0 #C6E68D;
-webkit-box-shadow: inset 3px 0 0px 0 #C6E68D;
box-shadow: inset 3px 0 0px 0 #C6E68D;
padding: 3px 3px 3px 6px;
-moz-transition: all 0.4s ease-out;
-webkit-transition: all 0.8s ease-out;
-o-transition: all 0.8s ease-out;
-ms-transition: all 0.8s ease-out;
transition: all 0.8s ease-out;}
.wishlist:hover {
-moz-box-shadow: inset 550px 0 0px 0 #C6E68D;
-webkit-box-shadow: inset 550px 0 0px 0 #C6E68D;
box-shadow: inset 550px 0 0px 0 #C6E68D;
color: #444444;}
OBS: Onde está em negrito você poderá substituir pelas cores desejadas, já onde está sublinhado você colocará a fonte da letra que aparecerá nas letras do menu. Certinho, agora Salve e Feche! Iremos agora para a segunda parte do tutorial, você deverá ir em Layout  Adicionar Gadgets  HTML/Javascript (Cole este código):
<div class="wishlist">Coloque as palavras aqui</div>
OBS: Desta vez, onde está em negrito você deverá substituir por o que quiser que apareça na hora. Caso queira adicionar mais itens desse, basta você copiar e colar o mesmo código de cima. Espero que tenham gostado do tutorial, consegui ele em dois Blog's, mais exatamente este, é do WHH.
Não poderia me esquecer de avisar vocês né, o eJhonas está tendo o seu primeiro Concurso valendo um domínio .com (Perfeito, não acham?), Caso queira participar basta clicar aqui.

4 comentários:

  1. Esse menu é lindo! Ótimo tutorial, nem sabia que era assim tão fácil (:
    Beijos,
    tudo-para-gaarotas (.blogspot.com)

    Ps: O Blogger está excluindo blogs com link no final do comentário, por isso coloquei meu link entre parênteses.

    ResponderExcluir
  2. Legal esse tutorial, já conhecia.
    O blog da blogueira | oblogdablogueira.blogspot.com.br

    ResponderExcluir
  3. Muito lindo menu, uii quem sabe eu uso no meu próximo layout :)

    Bjinhos *-*

    Fanny Dream

    ResponderExcluir
  4. Esse menu é bem bonito.
    http://ladyalen.blogspot.com

    ResponderExcluir

© eJhonas - 2012. Todos os direitos reservados.
Design Jhonas Balsas.
Tecnologia do Blogger.
imagem-logo