Fundo nos títulos dos posts

|
tumblr_lmmn09y6sm1qjecneo1_500_large

Atendendo a muitos pedidos, hoje vou ensinar como por uma imagem ou cor diferente no fundo do tírtulo dos posts do blogger.
O código é simples, o que complica é só ajustar as margens (como na hora de por fundo na c-box). Só lembrando que esse tutorial foi feito no modelo Viagem (Travel) do blogger, então o código correspondente ao título dos posts pode ser diferente em outros modelos.



tuto

1as12 Abra o blogger, vá em design > Editar HTML.

1as12 Procure por:
h3.post-title {

1as12 Cole logo abaixo desse trecho o seguinte código:
background:transparent url(LINK DA IMAGEM AQUI) no-repeat bottom;
align: center;
margin:.25em 0 0;
padding: 40px 5px 5px 50px;

1as12 Coloque o link da imagem onde se pede.
1as12 As medidas do "padding" deste código se ajustam á uma imagem de 500x60 pixels. Se a imagem que você for usar tiver um tamanho diferente, você terá que alterar os valores do padding. Lembrando que as medidas do padding seguem esta ordem:

padding: 1px (topo), 1px (direita), 1px (abaixo), 1px (esquerda);

1as12 Visualize se ficou bom e depois salve ou cancele.

divisória
1as12 Se quiser colocar apenas uma cor de fundo, basta colocar esse código abaixo de h3.post-title { :
background-color: #codigodacor;

Espero ter ajudado vocês! Kissus
sing-liah

27 comentários

  1. Ammeii
    www.klubeteen.blogspot.com

    ResponderExcluir
  2. Finalmente!!
    Brigada Liah, você é uma das melhores ;)

    Beijos,
    Fernanda Moraes 
    www.fearlessworld-blog.blogspot.com

    ResponderExcluir
  3. Muito útil esse tuto, eu já sabia como botar imagem, mas não como botar plano de fundo, legal >_< Quando eu enjoar do meu título eu boto o plano de fundo :*

    ResponderExcluir
  4. ooi, tem uma tag lá pra você!
    http://princessofdanw.blogspot.com/2011/06/tag-coisas-que-eu-amo.html
    beijos...

    www.princessofdanw.blogspot.com

    ResponderExcluir
  5. Hey Liah!  o meu blog está de volta e totalmente reformado (:
    visita lá e segue?

    www.poemasdamarii.blogspot.com

    *3*

    ResponderExcluir
  6. Oi amiga, vim aqui avisar de que você ganhou um selinho com regras em meu blog, visite nesse link:

    http://momentoyanka.blogspot.com/2011/06/selinho-blog-fera.html

    Bjs Fica com deus!

    ResponderExcluir
  7. Evelyn Vieira Rodrigυeѕ17 de junho de 2011 às 19:05

    Gostei da dica *--*
    visito sempre, mas nunca comento...
    Amo akie <3

    ResponderExcluir
  8. Muito útil esse tuto! amo esse blog! bjos
    http://innocenceteen.blogspot.com/

    ResponderExcluir
  9. Visito sim! Comente mais vezes, adoro ler comentários, kissus =*

    ResponderExcluir
  10. O meu é o modelo Picture Window e foi mesmo assim... não precisei mudar nada...
    Bjinhus e amo seu blog liah!
    www.aquieholugar.blogspot.com

    ResponderExcluir
  11. Amei esse post!! Muito bom!

    ResponderExcluir
  12. Amei esse post!! Muito bom!

    ResponderExcluir
  13. oii, você tem como por aí nos goodies o download do photoshop?

    ResponderExcluir
  14. oii, você tem como por aí nos goodies o download do photoshop?

    ResponderExcluir
  15. não tenho a tag h3.post-title {
     triste.

    ResponderExcluir
  16. Tutorial muito bom!Ficou perfeito no meu blog!Dá para reblogar?Beijos
    http://www.cerejadeglitter.blogspot.com/

    ResponderExcluir
  17. Ótimo tuto! Créditos eternos lá no meu blog OIEPOWQIE-
    Kisses

    space-sweet-girl.blogspot.com.br

    ResponderExcluir
  18. Tbem não tenho a tag h3.post-title {

    =[=[

    ResponderExcluir
  19. Liindo
    questao-deopiniao.blogspot.com.br

    ResponderExcluir
  20. Obrigado liah, desde quando eu conheci seu blog, o meu melhorou bastante (kkkk) graças a você ele ta ficando lindo, só falta os seguidores, eu sou uma criança e meu blog é sobre um jogo infantil chamado club penguin, ele é conhecido mundialmente, vou deixar meu link cprockeiro.blogspot.com

    ResponderExcluir
  21. Só pra avisar que a postagem está passando pra fora do local da postagem ! Beijos ! amei o tutorial

    ResponderExcluir
  22. "tírtulo" ?? kkkk errou feio hein :3

    ResponderExcluir

Related Posts Plugin for WordPress, Blogger...