sábado, 5 de outubro de 2013

Como colocar os comentários recentes com avatar no blog

Olá amores, vim ensinar para vocês como colocar de forma simples os últimos comentários do nosso blog. Através de uma gadget simples .. vamos conseguir este efeito lindo, assim como o modelo abaixo.

Últimos comentários
Muito legal né??! Vamos lá então, aprender a fazer???

Primeiro passo: 
Você vai em design e acesse a aba Layout. Clique em adicionar um gadget, então escolha a opção html/javascript, daí na janela que expandi, cole o código abaixo.


<style type="text/css">
    ul.w2b_recent_comments{list-style:none;margin:0;padding:0;}
    .w2b_recent_comments li{background:none !important;margin:0 
0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;}
    .w2b_recent_comments li .avatarImage{padding:3px;background:#fefefe;-webkit-box-shadow:
0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px #ccc;float:left;margin:
0 6px 0 0;position:relative;overflow:hidden;}
    .avatarRound{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;}
    .w2b_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
    .w2b_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 
12px;font-style: italic;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
    // Recent Comments Settings
    var
    numComments     = 5,
    showAvatar     = true,
    avatarSize     = 60,
    roundAvatar    = true,
    characters     = 40,
    showMorelink    = false,
    moreLinktext    = "More »",
    defaultAvatar     = "http://www.gravatar.com/avatar/?d=mm",
    hideCredits    = false;
//]]>
</script>
<script src="http://widgets.way2blogging.org/blogger-widgets/w2b-recent-comments-gravatar.js" 
type="text/javascript"></script>
<script src="ENDEREÇO COMPLETO DE SEU BLOG/feeds/comments/default?alt=json&amp;callback=w2b_recent_comments&amp;max-results=5" 
type="text/javascript"></script>

Segundo passo: 
> Onde está escrito Endereço completo do seu blog .. claro que você coloca o endereço do seu blog.
> Em nunComments você define a quantidade de comentários quer que apareça.
> Em characteres defina quantos caracteres quer que apareça.
> Clique em Salvar e arraste para onde quer que apareça em seu blog.

Simples assim ... gostaram? Espero ter ajudado ... Depois digam se conseguiram! Bjssss

18 comentários:

  1. Legal amiga
    Quero por as mais lidas
    Bjkas

    ResponderExcluir
  2. Bem simples, vou tentar fazer....
    Bjinhos

    ResponderExcluir
  3. que bacana amiga
    amei a dica e o tuto parece bem fácil
    lindo domingo bjs

    http://sermamaepelasegundavez.blogspot.com.br/

    ResponderExcluir
  4. Que legal, super fácil!
    Vou fazer lá no meu...
    Passei para te agradecer a visita flor e também para lhe convidar a apoiar a causa Outubro Rosa, campanha contra a câncer de mama, fiz um post sobre o tema hoje, visite e compartilhe, ajude a divulgar esta campanha!

    http://detudoumpouco28.blogspot.com.br/2013/10/outubro-rosa-apoie-esta-causa.html

    ResponderExcluir
  5. Acabei d fazer flor e deu certinho!
    Ai ficou tão lindo, passa lá pra vc conferir...

    valeu pela dica, amei!

    ResponderExcluir
    Respostas
    1. Ai que legal .. que bom que gostou. Vou lá ver! bjs

      Excluir
  6. Querida
    Isso para mim é um pouco complicado,mas...valeu.
    Gostei de saber que neste blog se entende muito de Informática.
    Um excelente domingo.
    Beijinhos da
    Beatriz - VIDA E PENSAMENTOS
    http://pegadasdeanjo.blogspot.com

    ResponderExcluir
  7. Adorei Roberta,que tal me ensinar como colocar top comentarista? bjs :)

    http://soumaedecinco.blogspot.com/

    ResponderExcluir
  8. bem facinho neh??
    bjs!1

    Carlah Ventura
    Blog: Intensa Vida

    ResponderExcluir
  9. Bem legal! Vou ver se coloco lá no blog ^^
    Obrigada pela visita lá no blog!
    Já estou te seguindo!
    Beijos e volte sempre!

    http://entreasppas1.blogspot.com.br/

    ResponderExcluir
  10. Legal a dica eu já usei e tirei.
    kkk
    Bju

    ResponderExcluir
  11. Que legal, adorei!
    bjus
    http://estou-crescendo.blogspot.com.br/

    ResponderExcluir
  12. Ótima dica
    beijos
    http://diariodasprincesasdamamae.blogspot.com.br/

    ResponderExcluir

Ser feliz é um estado de espírito. É ver o lado bom das coisas e das pessoas, é perdoar e pedir perdão, é fazer algo sem esperar nada em troca, é dizer eu te amo e abraçar quando der vontade, é aproveitar cada segundo ... vivendo cada dia intensamente, como se fosse o último, pois não sabemos se vamos estar aqui amanhã ...