Colocar comentários recentes com avatar de bordas arredondadas no Blog







Em alguns templates este widget  não está incluído, então aqui está o código disponível para você colocar esse widget de  comentários recentes com avatar de borda redonda (pode editar e deixar quadrada)é muito simples e fácil. Fonte do JavaScript Way2blogging


Veja a imagem de como fica:

Colocar comentários recentes no blog


Você pode colocar em qualquer parte de exibição de gadgets  do seu blog no Blogger.

Clique em Layout depois em  Adicionar um Gadget  ,clique no símbolo de + em HTML/JavaScript depois copie o código abaixo e cole no gadget ,faça a alteração do link(somente no que está azul) e mova para o lugar onde você quer deixar o novo gaddget de Comentários Recentes com avatar de bordas arredondadas

Copie todo código abaixo e cole no gadget:











<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 = 9,
showAvatar = true,
avatarSize = 60,
roundAvatar = true,
characters = 65,
showMorelink = false,
moreLinktext = "More »",
defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="http://widgets.way2blogging.org/blogger-widgets/w2b-recent-comments-gravatar.js"></script>
<script type="text/javascript" src="http://www.universodasdicas.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=9"></script>
</div>






Troque o  www.universodasdicas.com,  por www.seusite.com



Você pode alterar também essas partes no código:

        numComments = 9,  (Quantidade de comentários sendo exibido)
showAvatar  = true,(caso não queira mostrar o avatar, substitua true por false)
avatarSize  = 60,   (Tamanho do Avatar)
roundAvatar = true, (se quiser o avatar quadrado substitua true por false)
characters  = 65,   (Quantidade de caracteres por comentário)
showMorelink = true, (mostra Leia Mais,substitua true por false para esconder)
moreLinktext = "Leia Mais",(Você pode editar Leia Mais)



Só altere no código o que está sendo indicado, não tire nenhuma vírgula ou o código não irá funcionar direito.





Espero ter te ajudado,sua visita é sempre bem vinda,volte sempre e se puder nos siga aqui e nas redes sociais  e por favor comente!




10 comentários