29 de abr de 2012

Menu de folha


Olá meus amores, tenham um ótimo domingo assim como o meu (:

Hoje vou mostrar um tutorial diferente, ensinando como deixar seu menu em folha de folhinhas, fica muito cute e o tutorial é Fácil.

1- Vá em Design → Editar HTML e marque a caixinha "Expandir modelo de windget"
Tecle F3 ou Ctrl+F e procure por:
]]></b:skin>
Agora quando você achar esse código acima, antes dele cole esse outro:

/*---Início do Menu---*/bdg {font-family: tahoma; /* Fonte do Menu */width: 17%; /* Tamanho do Menu */float: left;background:#8EE5EE; /* Cor do fundo do Menu */padding: 5px;text-align: center;margin: 2px;-webkit-border-radius: 9px 0px 9px 0px; /* Pontinhas da Borda - não modifique se quiser o formato igual ao meu */-webkit-transition-duration: .80s; /* Duração do Efeito - não modifique se quiser o efeito igual ao meu */font-size: 08pt; /* Tamanho da fonte */color: #fff; /* Cor da fonte */}
bdg:hover {font-family: tahoma; /* Fonte do Menu quando passa o mouse */width: 17%; /* Tamanho do Menu quando passa o mouse */float: left;background:#FF69B4; /* Cor do fundo do Menu quando passa o mouse */padding: 5px;text-align: center;margin: 2px;-webkit-border-radius: 0px 9px 0px 9px; /* Pontinhas da Borda - não modifique se quiser o formato igual ao meu */-webkit-transition-duration: .80s; /* Duração do Efeito - não modifique se quiser o efeito igual ao meu */font-size: 08pt; /* Tamanho da fonte do Menu quando passa o mouse */color: #fff; /* Cor da fonte do Menu quando passa o mouse */}/*---Fim do Menu com Efeito ---*/
Modifique as cores as letras oque quiser, depois salve, agora para aparecer seu menu, você deve add um gadget (onde você quiser) o gadget HTML/JavaScript, e colar esse seguinte código:
<a href="Link"><bdg>Nome</bdg></a>

E colocar o Link da pagina e o nome da pagina, feito isso, seu menu estará pronto.

Thanks to Bomba de Glitter


13 comentários :

  1. nossaaa, brigada *-* tá salvo aqui, vou usar no de testes do rockssip e vai ficar lindo *-*
    beijos, thá mendes
    http://rockssip.blogspot.com/

    ResponderExcluir
  2. Amore você está nos meus afiliados, me coloca nos seus ?

    http://cd-candydream.blogspot.com

    ResponderExcluir
  3. ótimo tutorial!
    Seguindo amr, segue de volta? Beijos!

    http://crazyin-html.blogspot.com.br/

    ResponderExcluir
  4. Adorei o tutorial Ruth!!Quem sabe no próximo lay eu não uso né?Beijinhos♥
    http://www.viciadasemcupcake.blogspot.com.br/

    ResponderExcluir
  5. Amei o tutorial. Anw, acho que vou colocar ele! E claro, com os devidos créditos... *-*
    Beijos, fashionwithstyle.tk

    ResponderExcluir
  6. Amei o tuto. Parabéns pelo blog. E vc já esta na minha página de parceiros quando quiser pode colocar o Flor de Lis . Obrigada .
    http://sucessoparaseublog.blogspot.com.br
    Flor de Lis

    ResponderExcluir
  7. Deve ficar lindo no blog, gostei do tuto.
    Eu já estou com um, então no momento não irei usar. http://luanapdomingues.blogspot.com.br/

    ResponderExcluir
  8. Não da para copiar o código :3

    ResponderExcluir
  9. Não da para copiar o código :3

    ResponderExcluir
  10. Muito bom o seu blog,
    Já tô te seguindo no GFC,
    Segue de volta? Curti minha fanpage?

    brogandome.blogspot.com
    facebook.com/brogandome

    twitter: @carolposeidon
    Carol

    ResponderExcluir
  11. Ameiiiiiiiiiiiiiiiiiiiiiiiiiii *-*
    visita meu blog? :)
    www.diario-malvada.blogspot.com.br

    ResponderExcluir
  12. Muito útil, mas tem jeito de em vez de rosa, verde? (quando passa o mouse)

    ResponderExcluir

Sem chingamentos porfavor ;)
Todos os comentários serão respondidos.