Tutorial - Personalizando título do Post


Tutorial - Personalizando título do Post

Título centralizado
Vá até Design » Editar HTML e proucure por: h3.post-title {
E acrescente abaixo, este código:
text-align: center 
Caso queira o título alinhado à direita, substitua center por right.
Fundo colorido
continue na mesma linha (h3.post-title {), e abaixo dessa tag cole o código abaixo:
background: #E4E4E4;
Substitua #E4E4E4 por uma destas cores aqui, se preferir.
Divisória abaixo do título
Design » Editar HTML » Expandir modelos de widgets, e proucure por:
<div class='post-header'>
Logo acima dele, cole:
<div style="border-top: 1px dashed #707070"></div> 
Caso queira uma imagem, apenas adicione acima da tag este código:
<img src="LINK_DA_DIVISÓRIA"/>
Caso seu layout tenha duas tags iguais (a que se pede para proucurar), uma não vai funcionar quando você salvar/visualizar, e obviamente cole acima da outra tag e visualize, caso estiver tudo certo, salve.
Imagem como fundo da postagem 
Novamente, vá até Design » Editar HTML e localize a tag 
h3.post-title {
 Após a chave ({), cole o código abaixo:
background-image: url ('LINK_DA_IMAGEM');
width: 500px;
height: 40px;
Agora faça as devidas alterações: 500px é o valor da largura do seu fundo do título, e 40px a altura.

Sombra no título do post
 Vá em design - Editar HTML
2- Aperte ctrl f ou f3 e procure por esse código de baixo.
post-title
3- Você terá um código igual ou parecido com esse de baixo.
h3.post-title, h4 {
font:$(post.title.font);
color:$(pos.title.txte.color);
}

4- Coloque este código : text-shadow:1px 2px 2px#FFFFFF;  antes (em cima) de  }
5- Agora é só você mudar o código #FFFFFF  para a cor que você quiser  (tabela de cores aqui)


13 comentários

  1. Adorei..esse tuto ,só que o primeiro não deu certo no meu blog.

    http://renata-diariodeumaadolecente.blogspot.com.br/

    ResponderExcluir
  2. Noossa que tutorial otimo.
    Amei!
    Passa lá: www.blogsweetgirls.com

    ResponderExcluir
  3. Ficou massa o tutoriais!!



    BEIJUXX
    http://ianapaulinhaaaa.blogspot.com.br/

    ResponderExcluir
  4. Adorei o novo layout! mudou quando?
    Eu sempre uso centralizando o titulo do post, :}
    O vitrine maria está organizando um concurso, se chama garoto ou garota vitrine, participa? bj ;*
    http://vitrine-maria.blogspot.com.br/2012/07/gv-garoto-ou-garota-vitrine.html

    ResponderExcluir
  5. òtima ideia... concordando com a amiga aí de cima, a unica coisa que faço é centralizar o titulo rsrs
    fora isso...
    http://amaralstarlight.blogspot.com.br/

    ResponderExcluir
  6. @Renata Viana

    Renata eu refiz o teste aqui e deu certo. Tenta refazer aí ;)

    ResponderExcluir
  7. @Maria Marinho

    Que bom que vc gostou no novo design do blog :) A troca foi feita ontem . Pode deixar que vou dar uma olhadinha lá no seu concurso.

    ResponderExcluir
  8. Esses tutoriais vão ajudar muita gente!
    Nat o layout ficou lindo, parabéns...
    adorei mesmo!

    SUPER BEIJO
    Participe dos quadros no meu blog
    http://semcontrole.net.tc

    ResponderExcluir
  9. amei o tutorial :D
    Beijos até logo! (:
    www.Bikoti.blogspot.com

    ResponderExcluir
  10. Adorei o tuto , fica lindo o resultado *-*
    ~~
    Beijos ;*
    http://blogthelifeofgirls.blogspot.com.br/

    ResponderExcluir
  11. Amei o tutorial, super útil e fica lindo !

    http://garotadifferente.blogspot.com.br/

    ResponderExcluir