22 dezembro 2013

Menu Heart

| |
Oi gente *3*  Gostaram do novo template do blog? Eu acho que esse foi um dos melhores o menos feio que eu já fiz aqui pro blog. Também fiquei orgulhosa de mim mesma por ter feito a maior parte dele usando os códigos que guardo em minha mente *-* Mas mudando de assunto...

Durante esse "hiatus" do sorteio, eu fiz um menu que (na minha opinião), ficou bem legal e que eu queria compartilhar com vocês. Mas o código é meio grandinho e pode acabar desconfigurando caso não prestem atenção. Aqui está a preview do menu


Antes de começar, quero dizer que dependendo do tamanho da foto, vocês terão de subir ou abaixar o menu. A imagem que estou usando na preview é de 240•240

1 • Vá no HTML do seu blog, aperte F3 e procure por ]]><  ... Acima de cole:
#oii-isa:hover #menu-glowing-isa{
opacity: 1;
}
#menu-glowing-isa{
opacity: 1;
position:absolute;
-webkit-transition: all .60s ease-in-out;
-moz-transition: all 1s ease-in-out;-ms-transition: all .60s ease-in-out;transition: all .60s ease-in-out;
margin-left: 4px; /* Move o menu para os lados */
margin-top: -242px; /* Move o menu para cima ou para baixo */
}
#menu-glowing-isa a {
color: white; /* Cor do texto */
margin-bottom: 5px;
float:left; /* posição */
font-family: trebuchet ms; /* Nome da fonte */
overflow:hidden;
height: 13px;
padding:4px;
width: 10px; /* Deixa apenas o coração a mostra */
text-decoration:none;}
#menu-glowing-isa a:hover {
width: 55px; /* Deixa o resto do título a mostra Aumente se não der */}

2 • Depois de visualizar e salvar, vá em Layout • Adicionar Gadget • e cole: 
<div id="oii-isa">
<img src="FOTO" />
<div id="menu-glowing-isa">
<a href="/">♥ BLA</a><br><p>
<a href="/">♥ BLA</a><br><p>
<a href="/">♥ BLA</a><br><p>
<a href="/">♥ BLA</a><br><p>
<a href="/">♥ BLA</a><br><p>
<a href="/">♥ BLA</a><br><p>
<a href="/">♥ BLA</a><br><p>
</div></div>

•••••• ♥ ••••••
Espero que tenham gostado. Qualquer dúvida, vá na ask (que por acaso eu mudei)

15 comentários:

  1. AMEI o novo layout <3 Tão perfeito. O menu é lindo, amei.

    etcforme.blogspot.com

    ResponderExcluir
  2. Que lay divoooooo! Com certeza, o melhor do blog *u* Sambou! O menu é lindo, estou pensando seriamente em usar no próximo layout ( darei os créditos obviamente hihi ) Foi pros favoritos !

    htmlandresources.blogspot.com

    ResponderExcluir
  3. O menu ficou uma gracinha u3u; o layout ficou lindo mas, eu achei que tinha entrado em um tumblr quando vi o_o q SOPASKASOP' Adorei o post ~3~

    just-likethat.com

    ResponderExcluir
  4. Que layout divoso, meu Deus! Achei ele tão diferente <3'
    E esse menu é uma graça, amei :3

    Beijos,
    skyfall-dream.blogspot.com

    ResponderExcluir
  5. O layout está um estilo tumblr Lindo *3* Amei o menu xox ♥

    http://little-worldoficial.blogspot.com.br/

    ResponderExcluir
  6. R-A-I-V-A! Como? Como você consegue fazer templates cada um mais perfeito que o outro? Me ensina, por favor. Estou precisando MUITO disso. Sério, está perfeito. E adorei a ideia da sidebar, ficou perfeita!

    O menu ficou uma gracinha :3 Vou tentar encaixar em algum lugar no layout novo. AMEI!

    ~ Desculpa a falta. Ando meio ocupada com um layout novo do blog. E obrigada por ter passado lá no Yeowang, amor.

    써니데이즈 ♡ { Sunny Days } | Yeowang

    ResponderExcluir
  7. Aaaawn que layout perfeito escuro <3
    O menu é tão lindo, xemt <3<3

    Bezzos ~ unbrokenconnection.blogspot.com

    ResponderExcluir
  8. Muito lindo o layout.

    O menu, é fofo, e lindo;

    http://morango-sabor.blogspot.com.br/
    Visita?

    ResponderExcluir
  9. Isa, não sei se o comentário que eu escrevi foi pq bem na hora que eu mandei publicar o google me deslogou, aff! Enfim, eu adorei seu layout, ficou muito bonito, as cores ficaram ótimas, adorei os slide, as fotos do footer (e o psd dele, você que fez?) ficou tudo muito bonito, meus parabéns! O menuzinho heart também tá uma graça, tenho a certeza que ele será útil para vários blogs <3

    Feliz natal meio atrasadinho ^.~

    Beijos!

    Jana | sokawaii.com.br

    ResponderExcluir
  10. Olá! Eu gostei muito do novo layout! Tá bem lindo e super original, e o blog ficou com uma cara de tumblr, o que o deixa ainda mais lindo. O menu é bem fofo!

    S. Angel {♥} Blog novo

    ResponderExcluir
  11. Meu Deus! cada vez mais se supera nos layouts essa menina! poxa, nem sei o que dizer, isso aqui está tão original e divo, amo seu blog, isso só me dá mais motivos para amá-lo <3

    Lindo demais o menu, super ^^

    Adolescente Nerd

    ResponderExcluir
  12. Status: Seguindo o blog e apaixonada pelos tutos .
    Achei o Layout diwooo e original u.u
    Amei o menu , e dando uma espiadinha no blog de preview fiquei apaixonada pelo blog u.u Achei você super fofa ^^ +Fav ... Aceita afiliação ?
    Kissus
    http://tudoparaseuphotoscapeface.blogspot.com/

    ResponderExcluir
  13. Que layout é esse menina? Super lindo, parabéns!
    O menu também está incrível!
    Beijo, Ráh
    http://assimtipotudoraquel.blogspot.com.br/

    ResponderExcluir

« »