Image Map

04/01/2013

Como personalizar o título dos posts

montagens, quem não ama?
 Hoje é dia de tutorial! ~todas rebola~
 E hoje eu trouxe um que foi pedido pelas leitoras lá na ask do blog. Esse foi o de, como já devem ter notado, personalizar o título dos posts, o que é super simples!
 Trouxe as partes que são mais básicas mesmo, de colocar fundo no título dos posts, alinhar ele, colocar borda e etc. Ah, e eu acho que o pedido foi inspirado no título dos posts aqui do blog, que, pra quem ainda não viu/notou (o que é difícil) aqui tem print:
 Mas enfim, vamos ao post?

 Abra o HTML do seu blog, tecle ctrl+F e procure pelo seguinte código:
h3.post-title {
 Cole abaixo desse código o código do efeito que quer mudar no título dos posts do seu blog, que ficam abaixo dos prints de como fica:
 text-align: center;
 Você também pode colocar, ao invés de "center", "right" ou "left".
 border-bottom: 1px dashed #DCDCDC;
 Você pode mudar a cor (#DCDCDC) e a largura/modelo da borda (1px e dashed, respectivamente)
 background: #DCDCDC;
 Você pode mudar a cor (#DCDCDC) por uma de sua escolha.
text-shadow: 1px 1px 3px #000000;
-moz-text-shadow: 1px 1px 3px #000000;
-webkit-text-shadow: 1px 1px 3px #000000;
 Você pode mudar a cor (#000000) para a que preferir, mas não se esqueça de deixar todas iguais.
 Outra mudança que você pode fazer é colocar uma fonte diferente (tutorial aqui), o que fica super lindo e eu recomendo, viu? :3
 E, por fim, também pode colocar esses códigos como hover, pra que só apareçam quando você passar o mouse em cima do título dos posts. Aí é só colar abaixo de "h3.post-title a:hover", do print, que fica um pouco abaixo que do que a gente usou antes.
 Enfim, espero que ajude!
Post completo por Piink Cookie. Todos os direitos reservados. Copyright 2012. Plágio é crime.
 E aí, gostaram? Espero que sim. Na minha opinião todos esses tutoriaizinhos são bem simples, super fáceis de se seguir e super ajudam!
 É isso. Beijinhos com glitter :*

60 comentários:

  1. Amei o tutorial rsrrsrsrs muito legal flor *-*

    1ahistoria.blogspot.com.br =3

    ResponderExcluir
  2. Sempre tudo perfeitinho aqui. Adoro os seus tutos, tão explicadinho *-* Adorei /o/

    ResponderExcluir
  3. Essa sua fonte é realmente muito diferente :3 Nunca havia visto ela no Google Web Fontes, ou em qualquer outro lugar. Muito interessante, Paulinha <33 Beijos, :*

    whatever-it-takes-s2.blogspot.com.br

    ResponderExcluir
  4. Adorei o tuto. Bjus!!!

    galerafashion.blogspot.com.br

    ResponderExcluir
  5. Amei o tutu, perfeito o blog!

    Half My Heart

    ResponderExcluir
  6. Amei o tuto <3
    Eu mudo os meus mais eu mudo em outro lugar!
    Beijinhos :*
    cupcakeedicoes.blogspot.com
    emfrente-aoespelho.blogspot.com

    ResponderExcluir
  7. Adorei a dica
    vou tentar

    Beijos

    www.jessicarcoelho.com

    ResponderExcluir
  8. Ah! Mt legal esse tuto, uma letra mais diferente tbm dá uma diferença bem legal no layout >.<
    Bjs.

    http://dedicada1.blogspot.com.br/

    ResponderExcluir
  9. Bom final de semana para fazer, já estava atrás desse tutorial para mudar no meu, de grande ajuda.

    http://simples-e-agradavel-bloog.blogspot.com.br/

    ResponderExcluir
  10. Adorei o tuto... Ah se eu soubesse mexer em HTML rs'

    nossasfeminicesoficial.blogspot.com

    ResponderExcluir
  11. São ótimos modelos! Como sempre! :3

    Acesso Permitido.

    ResponderExcluir
  12. *u* fica dywo ft.limdo *------*

    ResponderExcluir
  13. Bem fofas os resultado sempre uso efeitos parecidos nos títulos dos posts dos meus layouts !

    corderosa.tk

    ResponderExcluir
  14. Adorei a dica logo vou tentar mudar o meu também \o/
    beijos
    inspiresenoamor.blogspot.com.br

    ResponderExcluir
  15. Oii (:
    Nossa,leu meus pensamentos? Tava louca no google atrás desse tuto. Mais,não achava de jeito nenhum.amei! vou usar jajá!
    karenselajaalmiron.blogspot.com.br/

    ResponderExcluir
  16. Legal a dica e é bem fácil.
    Bjs
    linda-e-loira.blogspot.com.br

    ResponderExcluir
  17. amei, ja sou leitora fixa. visita? http://garotas-incorretas.blogspot.com.br/

    ResponderExcluir
  18. Adorei a dica, as vezes coisas tão simples e não sei fazer ajudou e muito.
    www.thaimarques.com

    ResponderExcluir
  19. ótimo tuto, parabéns. gostei daqui e já estou seguindo. se puder visitar o meu depois rs

    http://realidade-imperfeita.blogspot.com
    Amanda Cristina

    ResponderExcluir
  20. Amei, acho que vou até mudar lá no blog :)

    http://deumjeitosomeu.blogspot.com.br/

    Beijos

    ResponderExcluir
  21. Retribuindo a visitinha... Obg pela visitinha e por seguir, gostei muito do seu blog e do tutorial e tambem ja estou seguindo.

    Xoxo :*
    teenagedream-blog.blogspot.com

    ResponderExcluir
  22. Ah, eu vivia atrás disso! Mas agora apenas sou postadora! *-* Retribuindo a visitinha :) ♥

    ResponderExcluir
  23. Adorei o tutorial, amei o blog *-*
    Tô seguindo se puder retribui pra chegar a minha meta?
    Beijão,@angelicapmota
    http://llegaraquince.blogspot.com/

    ResponderExcluir
  24. Bem legal o tuto,adorei.

    Beijos
    AR

    ResponderExcluir
  25. Gostei Paulinha, super fácil e da um efeito lindo !!
    Já estou usando ! hehehe :)
    Beijoos ;**

    sempregabriella.blogspot.com

    ResponderExcluir
    Respostas
    1. Obrigada Gabi, bom que gostou *3*
      Okok *---*

      Excluir
  26. Adorei o post, otimo tutorial
    bjinhos
    http://chuvadesonhooficial.blogspot.com.br/

    ResponderExcluir
  27. Amei,o tuto Divaa:>3
    Beijinhos com Glitter*_*
    Blog-Garotas-Imperfeitas.blogspot.com.br

    ResponderExcluir
  28. Qual a fonte do gadgets tags eu falo os links ! Por favor me responde rapido !

    ResponderExcluir
  29. Fiz tudo certinho mas não consegui mudar a cor do Título =(

    ResponderExcluir
  30. amei e estou usando.
    minhas-confissoes-2012.blogspot.com

    ResponderExcluir