7 de nov. de 2012

Tutorial: menu blueberry


Hello cutes! Tudo bem? Já faz um bom tempo que eu não posto um tutorial, né? Mas hoje eu vou ensinar como fazer o menu blueberry. Créditos ao Miki Candy. O menu é bem fofo! Vamos ver? Clique aqui para ver o print.
participe do super concurso que está rolando aqui no CT, valendo um layout + entrevista + divulgação por 1 mês! Tá esperando o que? Clique aqui e participe :) 
Vá em modelo  clique em editar HTML  procure por:
]]></b:skin>


Achou? Então cole o seguinte código abaixo da tag destacada, fazendo as alterações que você achar necessário, okay?

/* Menu Blueberry by Miki Candy */
blueberry{
color: #fff; /* cor da fonte quando passa o mouse */
text-align:center;
font-size: 11px; /* Tamanho da fonte do menu */
background: #3FCFAD ; /* Fundo do menu */
padding: 2px;
float: left;
margin: 2px;
cursor: crosshair; /*cursor */
width: 45%; /* tamanho do menu */
-webkit-transition-duration: .80s;
border:1px dotted #D682DE; /* bordas */
border-radius: 10px; /*---- bordas arredondadas ----*/
}
blueberry:hover{
background:#D682DE; /* fundo do menu quando passa o mouse */
border:1px solid #3FCFAD; /* bordas quando passa o mouse */
color: #fff; /* cor da fonte quando passa o mouse */
-webkit-transition-duration: .80s;
border-radius: 5px; /*---- bordas arredondadas ----*/
}

Agora iremos aplicar o menu no blog. Para isso vá em:
layout   adicionar um gadget  HTML/Javascript

<div><a href="URL 1"><blueberry>NOME 1</blueberry></a>
<a href=" URL 2 "><blueberry>NOME 2</blueberry></a>
<a href=" URL 3 "><blueberry>NOME 3</blueberry></a>
<a href=" URL 4"><blueberry>NOME 4</blueberry></a></div>

Prontinho, o menu está aplicado! Agora é só você fazer as alterações necessárias e salvar! Espero que tenham gostado e utilizem! 

18 comentários:

  1. AMei o tuto séra que pode seguir o meu blog, se não for pedir muito CLARO!!
    http://umaadolecentealucinada.blogspot.com.br/

    ResponderExcluir
  2. Que menu lindo *.* Dando uma passadinha aqui como me pediu baby e me surpreendi com esse blog maravilhoso, adorei vou voltar sempre. Qualquer hora volta a dar uma passadinha lá no blog, vou te esperar viu ?!?! Bjs c:
    umadoceimperfeicao.blogspot.com

    ResponderExcluir
  3. Aiin, fica tão fofo! Ameei!

    http://manual-girls.blogspot.com.br

    ResponderExcluir
  4. AAAh, que menu fofo >3< Mt bom tuto o/
    Morangostambemfalam | blogspot

    ResponderExcluir
  5. Oieee !! fiz o tutorial que você me pediu no meu blog tá •

    http://fabiolucas92.blogspot.com.br/2012/11/area-dos-comentarios-personalizado.html

    ResponderExcluir
  6. Oie flor !! fiz o tutorial que me pediu no blog ..

    http://fabiolucas92.blogspot.com.br/2012/11/area-dos-comentarios-personalizado.html

    ResponderExcluir
  7. Esse menu é muuito fofinho, né?? Adoro!! Beeijos!
    pqngarota.tk

    ResponderExcluir
  8. eu ja conhecia esse menu
    acho ele muitoooo fofo

    ResponderExcluir
  9. Que lindo esse menu! Talvez eu até use ele no próximo layout.
    Queria saber se você aceita parceria ou afiliação...
    Beijos!
    mundobakawaii.blogspot.com.br

    ResponderExcluir
  10. que legal Ameii, passa lá no meu blog e me segue! eu já estou ti seguindo!
    estou esperando sua visita bjs

    http://reino-kawaii.blogspot.com.br/

    ResponderExcluir
  11. queria que vc me coloca - se como filiado do seu blog !!

    da uma olhadinha no meu blog !!

    http://fabiolucas92.blogspot.com.br/

    ResponderExcluir
  12. Ótima tuto,quando eu precisar ja vou saber a onde ir

    bjss
    blog-polllyanna.blogspot.com

    ResponderExcluir
  13. Acho o menu perfeito, elee é muito fofo e lindo, vou usar no meu lay free, talvez!

    Cliquesnocapricho.blogspot.com

    ResponderExcluir
  14. Fica muito lindinho! Amei!
    Muito fofo mesmo!
    Beeijos...
    Tem post novo no blog, já viu?
    Batom De Framboesa

    ResponderExcluir
  15. Muito fofo esse menu!
    Muito tempo mesmo! Que bom que vc gostou, obrigada!
    Kisses!

    ResponderExcluir
  16. Amei o seu tutorial. E o seu blog é muito lindo.
    http://retratandocoisas.blogspot.com.br/

    ResponderExcluir
  17. Que fofo!Só achei muito simples pra mim ~le exagerada~

    cherrygo.blogspot.com

    ResponderExcluir
  18. Muito legal o tuto!
    Tem promoção lá no meu blog!
    overdose-teen.blogspot.com.br

    Bjs

    ResponderExcluir

LEIA ANTES DE COMENTAR
-não faço parcerias, apenas afiliações
-"segue meu blog" ou "seguindo, segue de volta" - só seguirei os blogs que eu realmente gostar, okay?
-não aceito tags nem selinhos
-deixe o link do seu blog no fim do comentário para que eu possa retribuir a visita