25 junho 2011

Personalize seus comentários -Confira

||
Assim que eu entrei no blog ontem eu vi um comentário de uma leitora pedindo um tutorial : como deixar os comentários iguais aos meus (coloridos) , e eu disse que assim que eu fizesse outro post explicaria , bom está aqui ! Esse é um tutorial super fácil de fazer mais precisa de muita atenção  Ok ? 
Você Fallen For Me

Primeiro vocês vão precisar da tabela de cores online , escolha a cor que você quer para o Plano de fundo dos comentários. Com a cor escolhida vá até > Design > editar html > ctrl  f > #comments  achada essa tag , no seu html estará assim (ou parecido)

#comments {
                                                           background: #FFEBCD; none repeat scroll top center;
   padding: 15px;
}

A parte em vermelha será a cor do seu background , apague somente a seleção vermelha e coloque a cor que você escolheu . Depois de ter alterado o fundo vamos para os outros itens ?


 

Ainda no seu html procure novamente pela tg #comments { Logo depois da linha que você alterou seu background estara escrito : 

#comments h4,
#comments .comment-author a,
#comments .comment-timestamp a {
color: #75cfd8;
}
#comments .comment-author:first-child {
padding-top: 0;
border-top: none;


}
.avatar-image-container {
margin: .2em 0 0;


}

Substitua esse código por esse : 

#comments h4 {
background:url(http://www._drikoti.blogger.com.br/back06.gif);
margin:1em 0;
font-weight: bold;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.2em;
}




#comments-block {
margin:1em 0 1.5em;
line-height:1.6em;background:url
(http://www._drikoti.blogger.com.br/back06.gif);
}
#comments-block .comment-author {
Font-weight: bold;

color:#FFB5C5;
font-size:12px;
margin:.5em 0;
font-family:tahoma;
height: 30px;
color:#FFB5C5;
line-height:2em;background:#F5DEB3;
}
#comments-block .comment-body {
background:url
(http://www._drikoti.blogger.com.br/back06.gif);
margin:.25em 0 0;
}
#comments-block .comment-footer {
margin:-.25em 0 2em;

background:url(http://www._drikoti.blogger.com.br/back06.gif);
line-height: 1.4em;
color:#111;border: 20px #FFE4E1;
text-transform:uppercase;
letter-spacing:.1em;
}
#comments-block .comment-body p {
margin:0 0 75;
font-size: 11 px;
line-height:1.5em;
background:#f1f1f1;;
color:#111;border: 3px #535456;

}


As cores em roxo significam : 1ª cor disse , 2ª cor data 
                                      em amarelo : A barra com o nome dos leitores


13 comentários:

  1. obrigada por fazer Luanara! ♥
    ah, tem selinho pra você lá no PD. tem algumas regrinhas, mas são fáceis.
    beijos

    www.princessofdanw.blogspot.com

    ResponderExcluir
  2. Eu entendo... Nem eu gosto de Twitter, mas pode participar sem mesmo, se ganhar, sei que é você, e na parte do twitter, coloca não tenho ^^.
    Mas se não quiser participar, não têm problema algum, não é obrigada rsrs.

    Beijos!
    Fernanda Moraes Vitoriano
    www.fearlessworld-blog.blogspot.com

    ResponderExcluir
  3. Oi Luh, gostei do tutorial, tentei fazer no meu, mais não consegui.

    http://mundofashionfemenino.blogspot.com

    http://olhaotititi.blogspot.com

    Beijinhos!!!

    ResponderExcluir
  4. Adoro seus tutoriais ^^

    http://dezesseisamargos.blogspot.com/

    ResponderExcluir
  5. você é casada e só tem 15 anos ?

    ResponderExcluir
  6. Oi Luh, obg *-*
    Foi muito útil para mim esse tutorial !

    Beijos,
    www.meianoiteequinze.blogspot.com

    ResponderExcluir
  7. Luh, consegui fazer \o/

    http://mundofashionfemenino.blogspot.com

    ResponderExcluir
  8. Obrigada gente >.< que bom que gostaram

    ResponderExcluir
  9. http://de-frente-para-lua.blogspot.com/

    ResponderExcluir
  10. Gostei mas não consegui, obrigada.
    meujeitodeser-oficial.blogspot.com

    ResponderExcluir
  11. Oiie! Ótimo tutorial e bem explicadinho!Ah eu não consegui achar os #comments :(

    ResponderExcluir
  12. Oi, tem como vc ensinar a colocar esse design dos seus comentários? Essa barrinha rosa com a foto dentro? Parabéns pelo blog.

    ResponderExcluir

- Eu respondo todos os comentários do blog, por mais que demore um pouquinho sempre respondo.
- Se você me fez alguma pergunta por comentário eu respondo no próprio post, então é só voltar no post onde perguntou que sua resposta estará lá.
- Adoro receber e-mail de leitoras, com dúvidas, elogios, sugestões e até algum desabafo como muitas fazem, acreditem não é nenhum incômodo <3
- Se quer criticar, critique de modo construtivo.
- Eu adoro quando vocês participam, afinal o blog é feito para vocês <3

Related Posts Plugin for WordPress, Blogger...