Menu com efeito hover

24 de fev de 2012


Oi gente!
Antes de tudo quero agradecer por tantos elogios sobre o novo layout, vocês não sabem o quanto eu fiquei feliz com tantos recadinhos fofos, e embora ainda não tenha conseguido responder todos, saibam que fico muito grata pelo carinho de vocês. E assim que der continuo respondendo, afinal, ainda tem uns 4 post cujo comentários ainda não foram respondidos, mil perdões!
Perceberam que o aniversário do blog ta chegando? Faltam apenas 13 dias *o* Nem me liguei que já estava chegando e não preparei nada, ainda. Mas vou preparar umas coisas bem legais, como um concurso ou sorteio (o que vocês preferem? Em ambos o prêmio com certeza será um layout, porque prêmio real eu não posso dar agora haha) e uma retrospectiva, que não pode faltar né? (pra mostrar meus antigos layouts nada bonitos rsrs)

Mas sem delongas, vamos pro tutorial? Até porque eu já falei de mais
Como algumas pessoas pediram, e muitas gostaram, resolvi ensinar como fiz o menu que estou usando atualmente, esse aqui:


Antes de começar, quero creditar o lindo blog da Déb, o Spázio DM, pois foi lá que aprendi a fazer esse menu lindo <3

Quer aprender? Clica em leia mais!

Vou logo dizendo que é um pouco complicado, por isso requer bastante atenção. Mas não desista hein? Antes de ir fazendo, leia o tutorial inteiro antes, pra não pular partes por pressa ok? 

1- Entre em Design > Editar HTML e usando Ctrl+F procure por ]]></b:skin>
2- Logo acima desse trecho que procurou cole o seguinte código:

.navi1 {
display: block;
height: 64px;
margin:0 auto;
position: relative;
width: 623px;
}
.navi1 ul {
float: none;
list-style-image: none;
list-style-type: none;
margin: 3px 0;
}
.navi1 ul li {
height: 64px;
background-image: url(url da imagem aqui);
background-repeat: no-repeat;
float: left;
margin: 0px;
padding-top: 5px;
position: absolute;
}
.navi1 ul li a {
display: block;
height: 100%;
width: 100%;
}
.navi1 ul li.sm1 { background-position: 0px 0px; left: 0px; width: 125px; }
.navi1 ul li.sm2 { background-position: -125px 0px; left: 100px; width: 124px; }
.navi1 ul li.sm3 { background-position: -249px 0px; left: 200px; width: 124px; }
.navi1 ul li.sm4 { background-position: -373px 0px; left: 300px; width: 125px; }
.navi1 ul li.sm5 { background-position: -498px 0px; left: 400px; width: 126px; }
.navi1 ul li:hover { z-index: 1000; }
.navi1 ul li.sm1:hover { background-position: 0px -75px; }
.navi1 ul li.sm2:hover { background-position: -125px -75px; }
.navi1 ul li.sm3:hover { background-position: -249px -75px; }
.navi1 ul li.sm4:hover { background-position: -373px -75px; }
.navi1 ul li.sm5:hover { background-position: -498px -75px; }

Importante:

Em background-image:  Você vai colocar o link da imagem do seu menu, vou deixar uma imagem base pra vocês terem uma ideia de como fazer ou se quiserem editar a mesma fiquem a vontade. Recomendo que editem e usem essa que vou disponibilizar, pois ela está com a largura dos "quadradinhos coloridos" certa, e se fizer com outros tamanhos fica difícil explicar, pois vai ter que alterar aquela parte enorme do background position e vai complicar muito. Então salve a imagem que vou disponibilizar e editem cores, acrescentem o nome das páginas e etc. Enfim, use a criatividade!

OBS: Base feita por mim.
OBS:
- A parte de cima é o menu em estado normal e a parte de baixo é o menu quando o mouse passa por cima.
- Em height: 64px é a altura da imagem e width: 623px é a largura, troque esses valores de acordo com o tamanho da sua nova imagem. Mas, na altura, se a imagem tem 155px você vai colocar por exemplo, 64px  de altura. Pois senão vai aparecer as duas partes do menu (a parte do estado normal e estado hover). Não tem um valor certo,  mas se usar a imagem que disponibilizei 64px de altura vai dar certinho. 
- Nesse menu é possível colocar apenas 5 links (um em cada espacinho).

Depois disso visualize e se estiver tudo certo, clique em salvar (o menu ainda não vai aparecer quando você visualizar, só visualize para ver se não interferiu em nada)

3- Para ligar essas imagens á um link você vai em "Design" > "Elemento de página" e adiciona um gadget HTML/JavaScript. Nele cole esse código:


<div class='navi1'>
  <ul>
    <li class='sm1'><a href='ENDEREÇO 1'/></li>
    <li class='sm2'><a href='ENDEREÇO 2'/></li>
    <li class='sm3'><a href='ENDEEÇO 3'/></li>
    <li class='sm4'><a href='ENDEREÇO 4'/></li>
    <li class='sm5'><a href='ENDEREÇO 5'/></li>
  </ul>
</div>

No endereço 1 coloque o link da página da primeira palavra que você colocou na imagem e assim consequentemente. Exemplo: 
Como "Início" é a primeira palavra do menu, no código onde pede ENDEREÇO 1 você vai colocar o link da página inicio, pois como já disse, é a primeira palavra do menu, então, endereço 1. 
E continue com os outros links: Endereço 2 = Link da segunda palavra do menu,  Endereço 3 = Link da terceira palavra do menu e assim consequentemente.

Feito isso é só arrastar o gadget para o lugar que quiser. Recomendo acima das postagens, que é mais largo e vai caber melhor. 

-Depois de adicionado o gadget você vai conseguir visualizar como ficou e se quiser editar a altura por exemplo, para se encaixar melhor. Ai é só ir alterando o valor da altura, aumentando, diminuindo e vendo como fica melhor (melhor é quando não aparece nenhum pouco do menu hover, aquele de baixo na imagem lembra?)

O tutorial é bem complicado, mas quem já entende um pouquinho de HTML vai achar mais fácil. Recomendo o PhotoFiltre para editar a base, mas também da pra fazer pelo PhotoScape. É isso, espero que tenham gostado, e entendido apesar de complicado rs

115 comentários:

  1. Que menu lindo *--* Vai combinar super com o lay que eu estou montando (:
    Beijos
    refugio-teen.blogspot.com

    ResponderExcluir
  2. Tem tag pra você!
    http://meninamocaoriginal.blogspot.com/

    ResponderExcluir
  3. Adoorei o tutorial,quem sabe eu nao consiigo fazer nér ? (=
    amor,da uma passadinha la no meu blog?
    www.paradateen1.blogspot.com <3 '

    ResponderExcluir
  4. Tem tag pra você lá no meu blog, passa lá!
    http://garotadesastrada-blog.blogspot.com/2012/02/tag_24.html

    ResponderExcluir
  5. Awnnnnnnnnnnnnnnnnnnnnnn amei! e sabe... voce poderia me recomendar um site de encomendas ou alguem que faz ? eu criei um blog mais queria que alguem fizesse BEM LINDO *_* rs.

    ResponderExcluir
  6. Oi,eu amei o tuto e o novo Lay do blog ficou mesmo D+!
    Beijos <3
    http://blog-as-poderosas.blogspot.com

    ResponderExcluir
  7. Muito show o menu!
    Eu não acho complicado por que aprendi a lidar com sprites de 20,30 imagens :)

    Antigamente eu era muito paranóica com o carregamento das páginas então sempre fazia sprites (isso que vc fez no menu de usar uma imagem só pra tudo)

    bjãoo

    ResponderExcluir
  8. COMOASSIMESSEDESIGNNOVOTADIVOEMARAVILHOSO *-*
    Nada fora do que se esperava, aqui é sempre lindo. Mas se superou! Adorei! AAAAAAAAAADOREI! Sem mais.
    Amei o tuto! Favoritei!

    ResponderExcluir
  9. bem complicadinho ein aushauhsuahu mas vou tentar depois, o resultado é o que vale *o*

    Adolecentro

    ResponderExcluir
  10. Bem interessante, sabia fazer esse tutorial, mas o tempo não deixava eu repassar para os leitores. Ótimos mesmo. *-*

    http://www.ecleticus.com

    ResponderExcluir
  11. Eu estava louca para saber como você tinha feito,amei o post!!*-*
    http://blog-mudancas.blogspot.com/

    ResponderExcluir
  12. Adorei, muito útil!!
    Vc ganhou uma Tag, vai lá pegar!! Beijos...
    http://fanforfan.blogspot.com/2012/02/tag-11-perguntas.html

    http://fanforfan.blogspot.com/

    ResponderExcluir
  13. Este comentário foi removido pelo autor.

    ResponderExcluir
  14. oi adorei seu blog!seguindo segue o meu também ?
    http://brilhants.blogspot.com/

    ResponderExcluir
  15. Oi flor,
    Já conheçe a tag "Onze coisas sobre mim"?
    Bem eu te indiquei.
    Vai lá e responde...Obrigado
    Beijinhos fofos da Ana
    anastarmoda.blogspot.com

    ResponderExcluir
  16. Ameei, próximo lay vou usar né hehe'
    bjs
    TDiaryofteens.blogspot.com

    ResponderExcluir
  17. lindo o blog mesmo!

    www.worldmagiic.blogspot.com

    eu ja estou seguindo! bj

    ResponderExcluir
  18. Eu prefiro concurso e vc pode fazer também como prêmio um semana, um mês de divulgação na barra lateral, um post indicando o blog...
    Obrigada pelos elogios *-*
    http://girlonlline.blogspot.com

    ResponderExcluir
  19. Oi vamos fazer uma entrevista ? me fala lá no meu blog !
    Garotadesastrada-blog.blogspot.com

    ResponderExcluir
  20. Amei o design do seu blog, esse menu fica lindo ^^

    Beijos,
    http://placestyle.blogspot.com/

    ResponderExcluir
  21. Que lindo o menu! Meio complicado de fazer, mas com certeza o resultado fica lindo! Adorei, adorei, adorei! Quem sabe eu use no meu blog, mas a preguiça da um jeito de não deixar :/ Enfim, eu amei o efeito, ficou lindo Anny!
    Beijos!
    Luly.

    ls2jb.blogpsot.com
    writewhilelove.blogspot.com

    ResponderExcluir
  22. Oii, lindo blog.

    Parabéns!!!

    Segue??? Sigo de volta
    com muito carinho

    Bjinhos
    http://meuryss.blogspot.com/

    ResponderExcluir
  23. Adorei!!!! Amore!! adorei!!
    Pf me diz como colocar a barra lateral do tipo dá sua??

    Lindo blog!! Parabéns!!

    http://selenatoresnaweb.blogspot.com/

    ResponderExcluir
  24. adooorei seu blog.. =P
    beijos
    http://fazendohistooria.blogspot.com/

    ResponderExcluir
  25. blog mais que perfeito.. seguindo aqui! poderia seguir de volta.. bjinhos

    muitomais-queamor.blogspot.com

    ResponderExcluir
  26. adoreeei o tutorial, com certeza irei usar ele no meu próximo lay *-*

    Flor queria te fazer uma pergunta, estava pensando em montar um blog de encomendas de layouts, mais como não tenho muito tempo para fazer tudo sozinha queria te convidar para fazer parte, montarmos um equipe. O que você acha?

    bjuss
    www.garotascomplicadas.com

    ResponderExcluir
  27. Oii Flor, haa no meu não deu certo, poderia me ajudar ?

    www.i--love--y.blogspot.com

    Thau !

    ResponderExcluir
  28. OMG, to no Blogroll do Go Imagines!
    Tenho que te recompensar por isso, vou fazer um post divulgando o blog daqui a alguns dias, aguarde...
    Obrigada por tudo linda!
    Beijos!
    Luly.

    ls2jb.blogspot.com
    writewhilelove.blogspot.com

    ResponderExcluir
  29. Este comentário foi removido pelo autor.

    ResponderExcluir
  30. muito lindo *-* ainda não usei no meu mais pretendo usar no proximo layout

    http://www.themagicteen.com/

    ResponderExcluir
  31. Prefiro concurso mesmo,no caso do menu prefiro TENTAR inventar um, pelo menos no meu novo layout, para não deixar a pagina de créditos lotada, mas é muito lindo*-* Ameey


    http://sonhosdeumadocegarota.blogspot.com

    ResponderExcluir
  32. Nossa muito obrigada por visitar lá e tbm pelos tutoriais vou usar no meu proximo lay q vai sair em julho no aniversario de 1 aninho la do blog *-*
    Ahh e eu tbm adoroo lapis de olho, o preto é o meu preferido, mas tbm adoro os coloridos e super aconselho o da vult além de serem lindos são ótimos para passar e dura um tempão é até ruim de tirar, hasuhasuhsa

    e super amei esse menu, =**
    Beeijos, sucesso!
    http://sonhos-na-adolescencia.blogspot.com/

    ResponderExcluir
  33. Sempre que eu faço o menu pra mapear a imagem fica desfocada =/
    otimo post!
    http://kelly-club.blogspot.com

    ResponderExcluir
  34. Olá, adorei o tutorial, talvez eu aplique em um novo design, achei bem facil! Ah, o design daqui tá muito lindo ;) Beijos!

    http://ma-petiit.blogspot.com/

    ResponderExcluir
  35. Amore posso pedir um tutorial pra vc? Faz um tutorial de como deixar os comentários, as tags e o Postado Por em baixo do título? Kisses e obrigada pelo seus cometários lindos no meu blog, fico muito contente! http://universodasofia.blogspot.com

    ResponderExcluir
  36. É lindo esse menu, um dia tento fazer *-*

    Beijos ;*
    http://blogthelifeofgirls.blogspot.com/

    ResponderExcluir
  37. Tem uma TAG pra você lá no Blog!
    http://smileekissesblog.blogspot.com/2012/02/tag.html

    ResponderExcluir
  38. Ótimo tutorial. Eu sempre fazia meus menus mapeando as imagens num site, mas é meio chatinho de fazer. Desse jeito não conhecia..

    E muito obrigada pelo voto! Qualquer coisa, pode pedir. (:
    bj
    depois-da-primavera.blogspot.com

    ResponderExcluir
  39. olhagostei pra caramba do teu blogger parabens ,, segue o meu tah ,, jat seguindooh akii...

    ResponderExcluir
  40. Indiquei seu blog no PS, confere lá!

    Beijos,
    http://placestyle.blogspot.com/

    ResponderExcluir
  41. Acho que vou só deixar o meu blog ter um pouco mais de acessos e colocar esse menu. ficou lindo

    ResponderExcluir
  42. Caraca que massa! :D
    Você já pensou em ser divulgada por ajudar alguém? Então, me ajude que eu te divulgo! Saiba mais aqui: http://pinkpimenta.blogspot.com/2012/02/vota-em-mim.html

    pinkpimenta.tk

    ResponderExcluir
  43. oii adoro seu blog, mto fofo

    s2

    oi, tem sorteio lá no blog http://coisascoisinhasminha.blogspot.com/2012/02/sorteio.html bjs

    ResponderExcluir
  44. Flor tem tag pra vc lá no blog! Beijos
    http://s2trendyteen.blogspot.com

    ResponderExcluir
  45. Oi anny la no meu blog tem uma tag que eu repacei para seu blog passa la bj
    http://myhdream.blogspot.com/

    ResponderExcluir
  46. OI ficaria muito muito feliz se você votassem em mim aqui.È Teenage Dream,tá?


    Teenage Dream

    ResponderExcluir
  47. Então menina, estou louca para dar uma mudada no design do blog, também! Mas não consigo arrumar um tempo de jeito nenhum! Tenho que estudar muito, o tempo que tenho livre eu saio de casa para tomar um ar, é muita novidade na vida, estou me sentindo sufocada! Você tem portfolio? Porque, se tiver disposta a fazer um design bem lindo para mim, mesmo que queira algo em troca, entra em contato! Você é confiável e super talentosa!

    exclusivoparagarotas.tk

    ResponderExcluir
  48. Adorei o menu, acho que vou tentar fazer no meu blog!O design está lindo mesmo, amei!
    Girls On-Line

    ResponderExcluir
  49. Ameei, lindo o seu meno, bem diferente :D

    Beijão
    Ana
    meninasantenadas.tk

    ResponderExcluir
  50. oiee,
    adorei o blog e o layout *---*
    Esse tutorial veio exatamente na hora certa :OO vou dar uma olhada com certeza!
    boa semana
    ;*

    ResponderExcluir
  51. Já arrumei o nome do blog nos afiliados. Obrigada por avisar, e desculpe pelo errinho haha

    bj
    depois-da-primavera.blogspot.com

    ResponderExcluir
  52. Cara, amei esse menu HJKGFHJKGF Sério!

    Parabéns pelo blog, é lindo e eu já estou seguindo!

    Bjonas e fique com Deus ♥

    Camilla Martins - http://sugar-dance.org

    ResponderExcluir
  53. Postagem mega booa ' hahaa. Quando você vai fazer um concurso? http://blog-foreverpretty.blogspot.com/

    ResponderExcluir
  54. NOssa amei seu blog...muito lindo mesmo!
    Segue?sigo de volta
    http://flmundoteen.blogspot.com
    bjs
    Fabi Lima

    ResponderExcluir
  55. Oii, primeira visitinha por aqui o/
    Adorei muito o seu blog! Muito fofo...
    Estarei comentando seus post!
    E aguardando mais post lindos como este.
    Seguindo, me segue também!
    Território das garotas
    @territoriodg
    Bjss *-*
    http://territoriodascompradorasdelivro.blogspot.com/

    ResponderExcluir
  56. Olá flor...
    Amei o post o blod enfim td!!!
    Visite o nosso blog;
    http://wwwcoisasdegilrs.blogspot.com
    Bjinhos da dinha .∞ᵔᴥᵔ∞.

    ResponderExcluir
  57. i, ameei o Post
    Dava para dar uma passadinha no meu Linda ?
    http://rebecafashionworld.blogspot.com/
    Post Novo, te espero tá ?

    #Bezoooos ;*

    ResponderExcluir
  58. Adorei o tuto, vou usar no próximo layout *-*

    http://generationteenbr.blogspot.com/

    ResponderExcluir
  59. Olá, adorei seu blog.

    Eu ando fuçando por ai pra aprender algumas coisas de html, mas ainda não sou muito boa. Só fico arriscando.

    Estou seguindo. Beijos.

    Tudo Tem Refrão

    ResponderExcluir
  60. Flor, minha mãe não deixou eu pagar pelo design, fiquei super chateada =/ Mas, enfim, quero que saiba que eu adoro o seu trabalho! Se algum dia você acordar com vontade de fazer meus design, me avisa ok? KKK! Enfim, obrigada por aceitar, pena que não deu, né?

    Beijos =*

    ResponderExcluir
  61. Já usei e aprovei, hein? Pode dar uma passadinha no meu blog, pra conferir o novo lay? Ficaria ETERNAMENTE grata XD
    Bjs
    Girls On-Line

    ResponderExcluir
  62. Gostei do tutorial muito bacana,mas tenho receio de mexer muito no html do meu Blog e depois perde-lo...seguindo seu cantinho,segue de volta linda.Obrigada..

    http://simonebastos2007.blogspot.com/

    ResponderExcluir
  63. Oie amores, ta rolando um concurso íncrível no meu blog junto do Piink Cookie, participa lá? http://blog-foreverpretty.blogspot.com/2012/02/concurso-meu-blog-arrasa.html , ah amei o menu vou usar no próximo lay.

    ResponderExcluir
  64. Eu achei complicado, mas nada melhor que um desafio, e o menu e show, e o tutorial ficou muito bem explicado, vou tentar fazer, adorei o tutorial, e o novo lay do GO IMAGINE está fantastico e lindo .

    www.perfeitinhablog.com

    ResponderExcluir
  65. Adorei, eu não sou la grande coisa com html mas olhando parece muito facil...

    ♥seguindo

    bjinhos♥
    vidacoolorida.blogspot.com
    @vidacolorida1

    ResponderExcluir
  66. Seu menu é lindo, foi a primeira coisa que reparei quando entrei aqui. Parabéns pelo tutorial.
    http://booblesrepublic.blogspot.com/

    ResponderExcluir
  67. Meu deus...Seu blog é tão bom!
    Chego até ter inveja dele !
    Bom,conteudo,otimo desing...Meu sonho é um dia chegar até
    parecido,seria muito bom se isso acontecesse !
    Mas gostaria que vc me ajudasse :*(
    Pode seguir meu blog(estou seguindo o seu) ? E aceita parceria ?
    Muito obrigada por ajudar,seu cantinho é muito chique e tem
    um belo charme ! Mas não chego nem aos dedos,muito obg !
    Selinho p vc !
    http://2.bp.blogspot.com/-skePRliAnkY/Tk-_IfffRhI/AAAAAAAAAwo/X_9VwcFGTSY/s1600/tumblr_lpl0x1a5Q61qm9w0bo1_500.jpg
    Meu blog da Avril
    http://avrilnoticias.blogspot.com/

    Nunca se esqueça que sue blog é lindo,o melhor !

    ResponderExcluir
  68. Adorei! Adoro seu blog...

    kisses,
    http://mundo-da-michelle.blogspot.com

    ResponderExcluir
  69. Hey Anny, faz um post sobre fontes? Você usa algumas tããão lindas, faz um post das que você indica e adora? Bjsss

    ResponderExcluir
  70. gostei muito do blog, amei muito esse tutorial, bem fácil , tentarei seguir ele *-*

    ResponderExcluir
  71. Esse menu é muito legal, eu usava no Sem Modos *-*
    Anny, vim apenas te convidar para participar do sorteio que ta rolando lá no meu blog, espero sua visita lá, beijinhos

    http://deboramoraiss.blogspot.com/2012/03/sorteio-do-livro-agua-para-elefantes.html

    ResponderExcluir
  72. oii eu me inspirei no seu blog para fazer o meu olha só

    http://dreamofsong.blogspot.com/
    beijos

    ResponderExcluir
  73. Oiii amore! Acho q vc iria gostar de saber q o Cupcake de Glitter ta com design novo, passa lá e vê o q vc acha pf? http://universodasofia.blogspot.com/
    Beijos linda!

    ResponderExcluir
  74. Amei o tutorial :D E o novo layout tá incrível =) Amei, amei, amei mesmo =D Bjs

    http://dreamsofagirl-blog.blogspot.com/

    ResponderExcluir
  75. A primeira coisa que fiz qnd entrei aqui foi me perguntar como você tinha feito, tá lindo *-* vou fazer um dia no meu *-*

    ResponderExcluir
  76. Olá, adorei o tuto.
    Que blog lindo!!!
    Estou seguindo!
    Beijos!
    neiabenevides11.blogspot.com

    ResponderExcluir
  77. ja conhecia esse tuto, é mt lindo *_*
    www.devaneiosdeumagarota.com

    ResponderExcluir
  78. amei o tuto, fica muito lindo.. dá um 'than'*-*
    eu já tinha tentado uma vez no meu, mas agr no momento n combina mt!
    seguindo aqui! http://girlsinful.blogspot.com/

    ResponderExcluir
  79. Oi, vim conhecer seu blog e AMEI, ele é lindo parabéns, comecei a seguir aqui, e vou voltar sempre que possível :) se quiser seguir o meu tbm, fique a vontade, Beijos;

    http://www.byjessicarodrigues.com/

    @jescrodrigues

    ResponderExcluir
  80. achar seu blog foi como achar um pote de ouro HAEHRUHERUUREA é muuito bom, ta me ensinando muito, ja ja meu blog feinho fica tão lindo como o seu é

    ResponderExcluir
  81. Adorei o tutorial, pensando em usar no proximo layout do meu blog (:
    Em falar nele, estou aqui pra divulgá-lo pela primeira vez aqui... espero que gostem dele
    http://againstfeelings.blogspot.com

    ResponderExcluir
  82. eu acho muito lindo esse menu.

    dica de filme no Caarmo
    caarmo.blogpot.com

    ResponderExcluir
  83. Oiii amei seu blog muitooo, vo vim aqui todos os dias para visitar ahhhmei
    Bejooos entrem no meu blog por favor http://blogcomplicatedgirls.blogspot.com/

    ResponderExcluir
  84. QUE COISA LINDA! gente seu blog e maravilhoso! e incrivel! tem dicas maravilhosas aqui olha sempre que puder estarei aqui! será uma honra ter você lá no meu blog! parasemprebemvestida.blogspot.com ! um bjo com muito glitter

    ResponderExcluir
  85. Ah, esse efeito é lindo, adorei muito *-* Como sempre, tutorial super bem explicado e quem sabe eu use. Agora não sei, pois estou usando um menu diferente. Mas achei esse muito lindo, pretendo usar futuramente.
    onthefame.tk

    ResponderExcluir
  86. hehe, sabia desse tudo também, ele é realmente muito bom! Ah, o novo layout ficou lindo (:

    www.caprichando.com

    ResponderExcluir
  87. Estava navegando pela net e tive a alegria de encontrar seu blog... Amei seu cantinho!!!

    Convido você a dar uma passadinha, se puder, no meu blog: http://www.docesonhodemenina.com.br/
    Conto com sua presença, vou amar te ver lá no DSM!!!

    Ah, como eu amei seu blog, deixo também um selinho para você: http://1.bp.blogspot.com/-68Bb05pFul4/Te1BfsqvBeI/AAAAAAAAATM/JPCRr0Mj7R0/s1600/dsm-selinho.jpg
    Pode crer, só os melhores ganham esse selinho!!!

    Desde já agradeço por tudo, que Deus lhe abençoe!!!

    Mil Sweetkisses ♥.♥
    http://www.docesonhodemenina.com.br/

    ResponderExcluir
  88. amai o menu na sexta (eu estarei com meu pc) vou tentar fazer este meno super fofis

    Beijinhos
    Fer>> garotasrosachock.blogspot.com

    ResponderExcluir
  89. Own! Você é demais Anny! Nunca iria achar um menu tão perfeito pro meu novo lay! Eu já tinha visto este post aqui antes mais só agora tomei coragem pra fazer e deu certo em um instante! Pra mim foi bem fácil rsrs
    Beijos! Maitê
    vê lá o novo lay! Espero que goste! s2

    ResponderExcluir
  90. Hooy ! recebi seu recadinho no meu blog! Muuuito obg por atender meu pedido sobre o menu! adoreei!
    O tuto é meio difícil mas vale a pena fica liindo!
    Adoro seu blog!
    Beeijo
    http://s2garotaclick.blogspot.com/

    ResponderExcluir
  91. Olá tudo bem ? AMEI SEU BLOG! Já estou seguindo pode conferir, segue o meu de volta? http://sociedade-girl.blogspot.com/ Beeijoos ;')

    ResponderExcluir
  92. Olá, encontrei seu blog e amei!
    ja estou seguindo, se puder e quiser seguir o meu, ficarei feliz :D
    beijos

    www.tracasebaratas.blogspot.com

    ResponderExcluir
  93. Hum, não deu muito certo! Será que fiz alo errado? Huahuahauhauha...

    http://www.sugarndreams.blogspot.com

    ResponderExcluir
  94. Não consigo entender ainda, no meu blog não funciona '-'

    me-and-myfriends.blogspot.com

    ResponderExcluir
  95. Ótimo tutorial,no próximo layout do meu blog,irei fazer isso.
    http://i-teenbr.net.tc

    ResponderExcluir
  96. Oii *-* eu ameii muito esse menu tanto que tentei fazer fiz de tudo só que o meu é de 8 links, e eu passei o dia inteiro fazendo isso .-. mexi no código e tudo mais, só que não deu certo ):
    Se puder me ajudar agradeço, msn: thaiza1999@hotmail.com

    Bjinhos
    t-bloggirl.blogspot.com

    ResponderExcluir
  97. oi!Achei super legal esse post! estou começando com um blog e quero fazer um menu bem legal pra ele!mas ainda preciso aprender um pouco mais, vc sabe o nome de algum site bem legal para eu mapear as minhas imagens???e como que fazer uma parte só de formulário???
    bjs boa sorte no blog,viu!?!?!
    pode dar uma visitinha no meu blog???
    somentegirls10.blogspot.com

    ResponderExcluir
  98. Ah mano, não acredito que um tutorial super fácil desses não me ajudou :( -No meu não deu certo, fica ícones bem piquinininho e não apareçe a edição da imagem , mais valeu pelo tutorial, ficou muito bom, lógico que ficaria melhor se eu tivesse conseguido, maas.. Parabéns pelo blogger, tá show!

    ResponderExcluir
  99. Ai , eu consegui.. só teve um problema , buuuá
    Fica um quadrado meio preto quando passo com o mouse em cima , ai , :/
    olha lá como que taá , http://onlyloveandlove.blogspot.com.br/
    porque aconteceu isso , tem como tirar ?

    ResponderExcluir
  100. Nossa adorei o tutu, e vou usá-lo. Do jeito que vc falou pensei que fosse bem mais complicado, até que é fácil. Bjos

    beccadesigner.blogspot.com

    ResponderExcluir
  101. Post muito bom: Vai supercombinar com o layout do meu blog, que é todo inspirado no Bob Esponja ...
    Gostam do bob Esponja???
    Visitem: http://ericagirlfashion.blogspot.com.br/
    " Detalhes" é o nome do meu blog.

    ResponderExcluir
  102. Lindo tutorial, e fácil;
    Bjs
    http://ericagirlfashion.blogspot.com.br/

    ResponderExcluir
  103. Esse negócio de ficar aprovando os comentários é muito chato, desmotiva o leitor a comentar, eu dificilmente comento em blogs que tem essa conduta, prefiro blogs livres, sem tantas coisas assim!
    Não é nenhuma, crítica ofensiva, mas sim construtiva, para o bem e bom funcionamento do blog, pq a minha opinião pode ser a de muitos...
    Obrigada beijos, espero que da próxima vez que eu voltar aqui esteja tudo livre, porq assim me acharei mas a vontade para comentar os posts;

    ResponderExcluir
  104. Demais o tutorial!

    uprisingteen.blogspot.com.br
    missrocklee.blogspot.com.br

    ResponderExcluir
  105. Heeeelp, fiz tudo certíssimo mais na hora que salvei não mostrou as imagens ;(

    ResponderExcluir
  106. Não, não. Deus super certo! Eu que errei na hora de colocar o URL da imagem que criei. rsrs
    Amei esse tuto, me ajudou muitoo!
    Segui meu blog?
    http://aninhaluyzacombr.blogspot.com.br/

    ResponderExcluir
  107. tentando colocar um menu no meu..... espero conseguir...

    ResponderExcluir
  108. Não entendo absolutamente NADA de HTML e achei o tutorial fácil. É´a forma de explicar do blog ^_^ parabéns! Já seguindo. Ei, como se personaliza a área de comentários?

    ResponderExcluir
  109. Muito legal o tuto. Dúvida: no código tem a url prá uma imagem. E a outra? Não são 2 prá dar o efeito? bjs

    ResponderExcluir
  110. Oi linda eu amei muito a dica, seu blog é sinceramente demais!
    Estou segindo passa ´lá no meu :
    www.mundoperfeitoeeste.blogspot.com
    Bjus ana

    ResponderExcluir
  111. Owwwwn, adorei *.*.*
    Vai ser o próximo menu do meu blog, é claro que vou creditar, super vou indicar *.*.*
    Beijão flor e bom dia ;*
    Lorrany - Mania de BG (se quiser vizualizar, é só clicar no perfil)

    ResponderExcluir
  112. Liindo .. Deu super certo ^^
    http://maluquicesquetenho.blogspot.com.br/

    ResponderExcluir
  113. Nossa, que menu lindo, adorei!
    http://srta-vasconcelos.blogspot.com

    ResponderExcluir

- Comentários do tipo "seguindo, segue de volta" "lindo o blog, seguindo, retribui?" Serão ignorados se não tiverem uma opinião sobre o post em si.
- Não aceitamos mais selinhos e tags, sorry!
- Leia a página "FAQ" e outras páginas internas antes de perguntar qualquer coisa.
- Sua opinião é sempre bem vinda. Mas seja educado!

© Go Imagine - 2014. Todos os direitos reservados.