12/05/2013

Menu novidades

Yo minna-san!!!

Boa noite, como vão? Peço desculpas por só postar a esta hora, afinal hoje é dia das mães e  me dediquei inteiramente a minha mas, mudando de assunto. Ontem recebi uns 5 comentários pedido para postar o menu anteriormente usado no Gadget "TAG's", realmente não fazia ideia de qual era o menu, pois quem fez meu layout anterior (Kuroshitsuji) foi a Roh, mas ela já me passou então trago aqui para vocês. Os créditos são inteiramente do tumblr H.A.M eu já o conhecia mas não cheguei a ver esse menu antes, coisa que achei bem legal. E mais uma vez, obrigada pelo layout Roh. Caso queira dar uma olhadinha no menu aqui esta (Menu Novidades) Então vamos lá?


1. Para começar vá ate o blog qual deseja adicionar o menu, então vá ate Editar Modelo. Abra sua aréa de códigos e então a selecione e use o atalho Ctrl+F. Então pesquise por ]]></b:skin>, assim que o achar acima dele adicione este código:

Códigos
.novi{width:210px;height:50px;background-color:#dad9da;text-align:left;text-indent:5px;margin-left:57px;font-family:bebas neue;font-size:25px;color:#4e3b4f;margin-top:10px;}
.novi p{font-size:14px;line-height:14px;}
.novi img{width:50px;height:50px;position:absolute;margin-left:-74px;}
.novi:hover img{-webkit-animation:brilha 0.7s;-moz-animation: brilha 0.7s;}
.novi:before {content:"";position: absolute;width: 0;height: 0;border-top: 2px solid transparent;border-right: 16px solid #dad9da;border-bottom:8px solid transparent;margin: 22px 0 0 -21px;}

@-webkit-keyframes brilha {
  0% { opacity: 0.5;}
  25% {opacity: 1;} 
  50% {opacity: 0.5;}
   75% { opacity: 1;}
  100% {opacity: 0.5;}
  }

2. Ele é super fácil de arrumar, basta trocar a imagem e as cores. Depois de tudo arrumadinho vá ate seu Layout e abra um gadget de HTML/JavaScript e dentro, cole:

Códigos
<a target="_blank" href="LINK"><div class="novi"><img src="URL DA IMAGEM" align="left">TITULO DA NOVIDADE<p> SUBTITULO.</p></div></a> 

Se quiser usar a mesma fonte, cole isso no seu CSS (acima de ]]></b:skin>): 

Códigos
@font-face { font-family: "bebas neue"; src: url('http://static.tumblr.com/cvlbtjz/cnsln9tpp/bebasneue.otf'); }

Bem é isso, então gostaram? Espero que sim, se tiverem duvidas basta perguntarem. Então ate a próxima.

46 comentários:

  1. Bruna12/5/13

    Nyaaaa obrigada Drw

    ResponderExcluir
  2. Lucia12/5/13

    Drw? Você tá muito ocupada preciso de uma ajudinha sua, pode entrar no face?

    ResponderExcluir
    Respostas
    1. Não exatamente só estou vendo anime, (muito bom anime) mas entro sim só um minuto.

      Excluir
  3. Que lindo! Adorei *------*

    @Escrita de Cabeceira

    ResponderExcluir
  4. Ahhhhhhhhhh tenho que usar esse efeito que lindooooooooo e ele ainda e muito util

    ResponderExcluir
  5. Anônimo13/5/13

    Gostei muito do menu!Talvez use no próximo lay!
    bjs
    bpblogdepapel.blogspot.pt

    ResponderExcluir
    Respostas
    1. Se usar, me diga! Pós sera um prazer ser a primeira a comentar

      Excluir
  6. Fica lindo esse menu.
    Bjs
    all-2you.blogspot.com

    ResponderExcluir
  7. Que lindo <3
    Vou favoritar para usar no próximo layout <3
    - Catching Pandas

    ResponderExcluir
  8. Que menu mais FOFO!!!
    Adorei, só acho ele meio grande e desajeitado...
    Adorei o menu.

    ResponderExcluir
    Respostas
    1. Yo Rayane, verdade ele e meio grande mas dependendo da imagem que usa fica legal.

      Excluir
  9. Anônimo13/5/13

    Yo, Wendy Chan ~

    Acho que entendo, afinal de contas foi o dia dela (sua mãe, alias de todas), é nada mais justo que isso! Sobre o menu ele é muito lindos, fiquei besta com ele, acho até que quero usar no meu próximo layout! Kisus, é até uma próxima.

    Kuusou World

    ResponderExcluir
    Respostas
    1. Yo Thonn-kun!!! Verdade apesar de o da das mães ser todos os dias, mas seria dificil comprar presente todos os dias neh? rsrs Mas fico contente que tenha gostado do menu, e obrigada pela visita. Beijinhos o/

      Excluir
  10. Bem bacana, adorei, provavelmente usarei no meu proximo lay!

    Uma quase nerd

    ResponderExcluir
  11. Esse menu é bem legal e bem lindinho também.
    Preciso falar que amo esse seu Layout. Comecei a ler o mangá do Black Butler esses dias e estou amando. Eu já achava seu lay divo, agora que sou fã do mangá estou amando ainda mais.

    Uma Borboleta Laranja

    ResponderExcluir
    Respostas
    1. Ohayo Nami-chan, fico tão feliz que tenha gostado do menu e do novo layout, apesar de entar bem simples. Nossa que legal mais uma fã do Black Butler é, impossivel não se apaixonar por este mangá de tão detalhista que é. Mas fico grata por seu comentário e por gostar de meu lay beijinhos Nami-chan.

      Excluir
  12. Que lindo, amei o tuto super perfeito *3*
    Sweet Love

    ResponderExcluir
  13. Que menu lindo, gostei :3
    Ótimo tutorial !
    cr4zy-world.blogspot.com

    ResponderExcluir
    Respostas
    1. Obrigada Alisson, fico contente que tenha gostado.

      Excluir
  14. Legal =)
    Talvez vou usar no proximo template!
    Estou seguindo, se puder seguir e votar na enquete agradeço: http://rain-of-shine.blogspot.com.br/
    Beijinhos

    ResponderExcluir
    Respostas
    1. Yo, yo obrigada por seguir faço sim uma visitinha lá.

      Excluir
  15. Ele é lindo :3
    novajuventudexxi.blogspot.com.br

    ResponderExcluir
  16. Lindo, lindo, lindo *3* Vou usar no meu blog de fanfics, fica lecau pra anunciar as atts :3 Adorei ♥

    Sixteen Springs ❉

    ResponderExcluir
    Respostas
    1. Tem toda razão, também estou para usar no meu de livros

      Excluir
  17. Yoo wendy-chan, achei muito kawaiii :3

    cantinho-da-modaa.blogspot.com

    ResponderExcluir
  18. Ah que lindo. Seu layout é maravilhoso. ♥

    Seguindo :*

    www.chitafilo.com

    ResponderExcluir
  19. Muito perfo esse menu *--*, amei *-*

    ResponderExcluir

Bem Vindos
Hi! Meu nome é Andréa Alark, mas conhecida como Wendy dona do blog Bunny Crazy. O blog foi criado em 2010 na intenção de ajudar a criação e desenvolvimento do seu blog. Aqui encontrará tutoriais e dicas de HTML, layouts gratuitos e muito mais.
Friends
Bunny Crazy by Wendy ❀
Bunny Crazy ★
Bunny Crazy ★
12345