tutorial

Personalizar Comentários

abril 24, 2013,5 Comments

Oi gente, eu queria me desculpar por não estar postando, é que teve semana de provas e na minha escola eles pegam muito pesado, teve provas no meu curso e eu fiz um simulado essa semana, além de ser final de bimestre e ter conselho de escolas né, então tá tudo muito corrido. 
Bom, me pediram muitas vezes para ensinar como personalizar a área de comentário, então eu vou ensinar a colocar a área de comentário que nem tá aqui no blog ok
Assim: 

Gostou? Quer aprender? Clica em Leia mais


1ºPasso: Vá em Modelo > Editar HTML e clica em Ctrl + F dentro da caixa de HTML e procure por: 

/* Comments

Ao encontrar, seleciona todo o código que estiver entre #comments até /* Widgets você apaga. 
Depois de apagar você cola: 

#comments a { color: $(post.title.text.color); } .comments .comments-content .icon.blog-author { background-repeat: no-repeat; background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAAXNSR0IArs4c6QAAAAZiS0dEAP8A/wD/oL2nkwAAAAlwSFlzAAALEgAACxIB0t1+/AAAAAd0SU1FB9sLFwMeCjjhcOMAAAD+SURBVDjLtZSvTgNBEIe/WRRnm3U8RC1neQdsm1zSBIU9VVF1FkUguQQsD9ITmD7ECZIJSE4OZo9stoVjC/zc7ky+zH9hXwVwDpTAWWLrgS3QAe8AZgaAJI5zYAmc8r0G4AHYHQKVwII8PZrZFsBFkeRCABYiMh9BRUhnSkPTNCtVXYXURi1FpBDgArj8QU1eVXUzfnjv7yP7kwu1mYrkWlU33vs1QNu2qU8pwN0UpKoqokjWwCztrMuBhEhmh8bD5UDqur75asbcX0BGUB9/HAMB+r32hznJgXy2v0sGLBcyAJ1EK3LFcbo1s91JeLwAbwGYu7TP/3ZGfnXYPgAVNngtqatUNgAAAABJRU5ErkJggg==); } .comments .comments-content .loadmore a { } .comments .comment-thread.inline-thread { background: #FF6A6A; box-shadow: 0 0 15px #FF6A6A; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; } .comments .continue { }
Modificando o que está em negrito que são as cores, troca por aqui (www)
Agora o mais essencial, antes de /* Comments Sem precisar apagar nada, cole: 


#comments { background: #a7caed; box-shadow: 0 0 15px #7fa4d6; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; padding: 15px; } #comments .comment-author { padding-top: 1.5em; } #comments h4, #comments .comment-author a, #comments .comment-timestamp a { color: $(post.title.text.color); } #comments .comment-author:first-child { padding-top: 0; border-top: none; } .avatar-image-container { margin: .2em 0 0; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; box-shadow: 0 0 15px #3b6586; }
Mudando apenas o que está em negrito, depois é só você visualizar e se estiver tudo ok, salve e pronto! 
Caso tenha algum problema é só perguntar nos comentários! 
Espero ter ajudado, Beijos


You Might Also Like

5 comentários:

  1. oi, eu gostaria muito de por coisas assim no meu novo blog. Mas o editor de HTML mudou completamente, e, não tem mais nada de códigos pra me achar. Vc ja viu o novo editor ? Se sim teria como me ajudar ?

    ResponderExcluir
    Respostas
    1. Eu fiz um post falando sobre a nova interface do blog recentemente >> http://onedithings.blogspot.com.br/2013/04/nova-interface-editar-html-como-mexer.html xox #Camila

      Excluir
    2. Mas o meu HTML não mudou como o seu.. Ele é metade do novo e metade do antigo... Não tem nem como mexer que o negócio da pau...

      Excluir