quarta-feira, 2 de novembro de 2011

Colocando avatares em comentários anônimos

Sabe quando alguém comenta em anônimo ou sem nenhuma imagem no seu blog? E fica aquele vácuo??   Eu não sei vocês mais a mim incomodava bastante. Tanto que já cuidei disso a tempos. E hoje eu criei vergonha na cara  e vim passar a vocês esse tutorial muito simples que faz toda a diferença! Confira o antes e o depois:
O tutorial foi dividido em 4 passos muito fáceis! E para facilitar ainda mais suas vidinhas  eu ainda deixo aqui vários avatares prontos mais é claro que vocês podem criar os seus! Mais pra quem escolheu uma das imagens abaixo pode pular direto para o passo 3 *-*
                  

Crie uma imagem que irá aparecer nos comentários anônimos ou para aqueles que não possuem fotos ou imagens. A imagem deve ter as medidas certas que são 37x37 
Sei que é pequeno, mais é a vida gente hahaha.

Hospede a imagem em seu próprio Blog ou em um site que faça o serviço gratuitamente exemplo:http://imgur.com/ (Feito isso deixe a imagem ai por enquanto)
Vá no seu HTML dê um ctrl + F e procure por:          /* Content
Logo abaixo disso cole o seguinte trecho:

div.avatar-image-container {background:url(http://URL_da_Imagem) no-repeat center center;} 
div.avatar-image-container img {display:none;} 
div.avatar-image-container img.delayLoad {display:block;}



Ficando assim:


 Copie a url da imagem e cole apenas onde está indicado de rosa.

Agora é só salvar e ir lá conferir. Espero que tenham gostado *-*
xau xau pessoas!

86 comentários :

  1. nossa eu era o tipo de pessoa que comentava sem foto rsrs ! e fica realmente mto feioo' mas como sempre a Jackie da um jeito em tdO'
    Adorei seu Tutu de hje fica bem mais lindo um blog com a pagina de comentários com foto !
    e sem fala que o tutu é super facil :k:
    Bjs

    ResponderExcluir
  2. Flor, desculpa informar, mas não pode morar na casa de praia, é só pra eventos, kkk! escolhe outra lá! ah sim, colocou o selo, estarei mudando seu status, bjs :*

    ResponderExcluir
  3. Adorei esse tutorial, realmente ficar aquele comentário sem imagem incomoda mesmo rsrsrs
    tem uma tag para você no meu blog, espero que goste ^^

    http://conversando-com-a-lua.blogspot.com/2011/11/tag.html

    ResponderExcluir
  4. Super fácil, vou fazer.
    Tem post novo. Comenta?
    http://girlteen-s2.blogspot.com/

    ResponderExcluir
  5. Achei super interessante !!! gostei :D você faz encomendas para layout personalizados ?? beijinhos.

    ResponderExcluir
  6. meu Deus.. Jackie, vc sim, é um exemplo de pessoa que da jeito em tudo.. admiro.. hahahaha
    beijooo
    adoreeei!

    ResponderExcluir
  7. Jackie eu ja fiz de tudo e não consegui!

    O que será que aconteceu se eu fiz certinho?

    Nunca da certo comigo esse tutorial!

    :/


    Lary♥

    ResponderExcluir
  8. Yeeeeeeeeeeeeeeaaaaaaaaah!

    Depois de tantas tentativas consegui Jackie!

    Muito obrigada pelo tutorial e pela imagem que eu usei!!

    Muito obrigada mesmo!!!


    Te adoro minha Rainha de Tutoriais!!


    Lary♥

    ResponderExcluir
  9. Eu resolvi tirar a opção "Anônimo",muitos deles incomodam com sua opinião :(

    Visita Jackie ?? Faz tempo q não vejo lá U.U :}

    http://meianoite-br.blogspot.com/

    ResponderExcluir
  10. Oi Jackie , seguindo o seu blog !
    Nossa adorei essa postagem , realmente
    esses anônimos irritam demais não é ?
    Faz uma visitinha no meu blog >>
    meigaedelicada.blogspot.com

    ResponderExcluir
  11. Oi fofa *-*

    Parabéns pelo tutorial... super bacana *-*

    Eu não me revoltei contra os bêbados, eu só falei a minha opinião.

    Sim, eu fui a primeira a chegar na festa. Quem olha pra mim pensa que eu sou a maior rebelde, né? Mas eu sempre sou pontual nos compromissos, e se atraso, não é por culpa minha.

    Esses garotos de hoje que bebem podem ser os futuros velhos de bar de amanhã.

    Bjonas (:

    Fique com Deus ♥

    ResponderExcluir
  12. Jackie,plagiaram
    VC!
    Aki
    o
    site
    plagiador
    http://manahatori-teengirls.blogspot.com/2011/11/crie-sua-caixinha-link-me-aqui-e-on_03.html#comments

    ResponderExcluir
  13. Haha' ajudoou bastante, eu ja tinha visto outros tutu desse, mais nenhum funcionava =/
    Voou colocar no meu agr ^^

    ResponderExcluir
  14. AMEI!!! Super fácil,tbm acho que fica meio que no ''vácuo'' isso de não ter foto!!

    http://magicmih.blogspot.com/

    ResponderExcluir
  15. Olá só passei para conhecer o blog. Bjinhus até mais
    http://amoracherry.blogspot.com/

    ResponderExcluir
  16. Adorei muito fácil de fazer,e fica super mais bonitinho. :h:
    Beijinhos

    http://soelasgirls.blogspot.com

    ResponderExcluir
  17. Oi, tudo bem, eu tenho um blog e gostaria de colocar esse template aqui:
    http://jacquellinyzanini.blogspot.com/
    Eu o baixei normal, mas quando eu vou copiar o código,copio a primeira parte mas embaixo quase no final diz que a página XML não pode ser exibida e eu queria muito esse template se você puder me ajudar me passando o código ou coisa assim obrigada desde já.
    endereço: www.passosdeunicornio.blogspot.com

    ResponderExcluir
  18. Jackie desculpa mais li os seus comentários e vi q vc foi plagiada,Já aconteceu comigo e ñ gostei nada , e ñ quero q acontece com nenhuma das minhas seguidoras.Escrevi uma coisa no tal blog da menina ,acho q ela nen vai aceitar.Me desculpa se eu fiz a coisa errada mais eu não aguentei.

    Tirando isso , Seu blog está perfeito , obg pelos tuto , muito utilitário.Bjs

    http://soelasgirls.blogspot.com/

    ResponderExcluir
  19. Hooy Lola não consegui responder no seu blog pois lá n tem nenhum post, tá linda!

    Guria após baixar o template não é necessário copiar nada ok!

    É só seguir esse tutorial tá: http://templatesparanovoblogger.blogspot.com/2007/08/sobre-como-instalar-os-templates.html

    :l:

    ResponderExcluir
  20. muito obrigada funcionou perfeitamente!
    http://tudoparaorkutfeniniemasculi.blogspot.com

    ResponderExcluir
  21. ooi jackie uma noticia ruim e uma boa para vc
    a ruim é q o garotas teen acabou :( a boa é que eu fiz outro blog e presiso de vc para a divulgaçao!


    quer parceria flor?

    beeeijos

    http://isperfectdream.blogspot.com/

    ResponderExcluir
  22. Dnd Flor vc merece *-* ,q bom que gostou do blog,beijos :h:

    ResponderExcluir
  23. Fica muito melhor com o avatar.. Eu fiz no blog.. Mas não consegui ver como ficou, oakoskaosk. Não tenho nenhum em meu blog, kk

    Bjok´s, Fraan ah e esse avatares são muito fofinhos..

    ResponderExcluir
  24. Pronto fiz meu link me, saksaopk.

    Vou te adicionar nos parceiro..

    Bjok´s, guriia

    ResponderExcluir
  25. Oi, adorei o post. na verdade o blog inteiro;)
    Já to seguindo...segue de volta? Ah e vc aceita parceria?

    http://garotamaisgarota.blogspot.com/
    Bjs>.<
    Ps.: espero a resposta no blog :h:

    ResponderExcluir
  26. Eu já sabia esse tutorial só que eu que gerei os códigos haha *-*
    Diva te convido para participar do sorteio do meu blog,
    espero você lá viu no meu cantinho e com sua participação.
    ULTIMO DIA PARA PARTICIPAR.
    Bezos Rawr =^^= -------> Bikoti.blogspot.com

    ResponderExcluir
  27. Hello Jackie love tutorial

    ResponderExcluir
  28. Valeu mesmo!
    Já virei fã de seu blog!
    Beijos!

    www.madeixasoderosas.blogspot.com

    ResponderExcluir
  29. Este comentário foi removido pelo autor.

    ResponderExcluir
  30. Ajudou muito Jackie!
    Muito obrigada.
    http://garota-fashiion.blogspot.com/

    ResponderExcluir
  31. Linda esse codigo não foi eu que fiz mais oque ultilizei no meu blog. tendeu?
    Diva te convido para participar do sorteio do meu blog,
    espero você lá viu no meu cantinho e com sua participação.
    ULTIMO DIA PARA PARTICIPAR.
    Bezos Rawr =^^= -------> Bikoti.blogspot.com

    ResponderExcluir
  32. JA ESTOU SEGUINDO ME SEGUE TB

    WWW.MAKEPOPULAR.BLOGSPOT.COM

    ResponderExcluir
  33. Vou fazer no meu! Eu tinha achado um tutorial desses na net,só que estava muito confuso.O seu tá tudo explicadinho!

    I love Is Jackie Dream! :d:

    Beijos!

    www.meninacute-s2.blogspot.com

    ResponderExcluir
  34. Design, tensa e unica, agoora foi rasgado.. certinho! Bateu direitinho comigo :P

    ResponderExcluir
  35. aamei o post!!otima dica!! faz um tutorial ensinando a deixar a area de comentarios igual a sua!!!
    adoraria ver como faz muito lindooo akii!!!
    http://spaceteen-chris.blogspot.com/

    ResponderExcluir
  36. Jackie faz um tutorial de como colocar imagem nos comentários.. Tipo os comments desse blog:

    Bikoti.blogspot.com
    Beijos
    Duda

    ResponderExcluir
  37. o meu nao tem esse codigo /* Content
    :a:

    ResponderExcluir
  38. o a mor esta em jogos,,,,

    ResponderExcluir
  39. oi linda eu sou roberta

    ResponderExcluir
  40. buaaaaa :i: pq nunca da certo comigooooo buaaaaaaaa vou chorar de verdade :/

    ResponderExcluir
  41. O meu também tá ficando sem foto alguma e até das pessoas que tem sai será que eu estou fazendo errado? Devo estar né...:a:
    Amei seu blog linda..
    http://mundrose.blogspot.com/

    ResponderExcluir
  42. OMG!Quase tive um ataque quando eu salvei o negócio e o fundo,a sidebar,a fonte dos links,tudo desapareceu!!!!!
    Aí eu voltei no HTML,tirei a parte q eu mudei e voltou.
    Nunca mais tento:k:
    Beijos

    ResponderExcluir
  43. @Paulinha♥ Linda tente em um blog de testes (:
    é um tutorial básico é fácil de fazer! beijus *--*

    ResponderExcluir
  44. Olá :b: estava me matando de procurar esse código mais ainda bem que achei valew :f:

    ResponderExcluir
  45. :g: Esse eu ja sabia mais perfect :c:

    ResponderExcluir
  46. Valeu pelo tutorial, Jackie! Depois faça o teste como "Anônimo" no meu Blo para eu ver como ficou kawaii. xD
    Beijos!

    http://anonlypossibility.blogspot.com.br/

    ResponderExcluir
  47. Amei a dica e o tutorial

    Segue? Eu sigo de volta! Meta 20 seguidores premio= 50 background+Primeiro Tutorial

    Vuuuup>>>http://portal-girls-oficial.blogspot.com.br

    ResponderExcluir
  48. Adorei o tutorial mas no meu Blog não funcionou. Quando coloco o código que você passou fica sem imagem alguma, aparece somente o texto, nada de imagem. Que pena, eu queria tantooooooooooo

    ResponderExcluir
  49. Super útil, deeu um UP no meeu blog!!
    Naqueles comentários anonimos, agr ta lindinho vlw
    http://comentariosde1garotaqualquer.blogspot.com.br/

    ResponderExcluir
  50. Fernanda Silva Menezes Lopes14 de dezembro de 2012 12:11

    Nananinanão !
    Ele bota a MESMA foto em todos os COMENTÁRIOS !]

    ResponderExcluir
  51. TODOS os avatares ficaram com a mesma foto :c

    ResponderExcluir
  52. Muito obrigada Jackie o tuto me ajudou bastante, mais no meu blog ninguém comenta Anonimo, agora é só esperar pra ver o resultado!!
    #May-Sun

    layrakauana.blogspot.com

    ResponderExcluir
  53. Amei o tutorial ja vou usar!!

    http://www.planet-imagine.blogspot.com.br/

    ResponderExcluir
  54. Oi.. No meu blog de testes não tinha /* Content, então eu fui em personalizar > avançado > adicionar css e deu certo. Talvez, creio eu, que colocando encima de ]]> também funcione (Não entendo lá essas coisas.. XD).. Bjoos!

    ResponderExcluir
  55. Bem legal esse tutorial, gostei (y)

    Quando fui tentar colocar no meu, apareceu a imagem que coloquei tanto nas fotos de anônimos quanto os que não estavam em anônimo. É assim mesmo?

    bj :*

    ResponderExcluir
    Respostas
    1. Não é.
      Como não utilizo esse código a dois anos não posso lhe ajudar :c

      Excluir
    2. Jackie Não Acho O Codico No Novo Html! Faz Atualização?

      Excluir
    3. É igual eu falei pra guria de cima, não utilizo esse código a mais de dois anos, então não garanto nada..

      Excluir
  56. Quando você faz o modelo viagem, ele da certo sim, mas quando é layout(free) pronto não dá certo! :/

    ResponderExcluir
  57. Ficou bem legal, só que eu 'a dona do blog' ficou com a mesma carinha. jeje
    Mas ficou muito fofinho. Obrigada!

    ResponderExcluir
  58. Eu vou pirar com essa coisa de blogger, resolveu fazer manutenção justo quando finalmente acho o tuto *--*

    ResponderExcluir
  59. Fui fazer isso e o meu plano de fundo sumiu e não volta mais

    ResponderExcluir
    Respostas
    1. Nesse caso só retirar o código Analyne (:

      Excluir
  60. Jackie Zanini ja tirei mais meu fundo ta branco tem como me ajudar??
    http://dicas-das-bff.blogspot.com.br/

    ResponderExcluir
  61. Jackie Zanini eu ja retirei o código mais continua do mesmo jeito, preciso muito de ajuda

    ResponderExcluir
    Respostas
    1. Então Analyne, tu fez algo de errado, ou na hora de colocar os códigos ou na de retirar, nesse caso só refazer o processo com mais atenção que da certo ok?

      Excluir

.