04/01/2015

Comentários Recentes com Avatar

Trouxe um tutorial super legal,para personalizar os seus comentários recentes. Os créditos vão para o Bunny Crazy.
Vamos lá!!

Primeira mente em seu painel, escolha o blog que sera adicionado o código. Então vá ate layout e abra um novo gadget de HTML/JavaScript, dentro dele cole o seguinte código:

<div id="recent-comments-box"><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     = 4,    showavatar     = true,    avatarsize     = 60,    roundavatar    = true,    characters     = 40,    defaultavatar     = "http://www.gravatar.com/avatar/?d=mm",    hidecredits    = true;//]]></script><script type="text/javascript" src="http://bloggerblogwidgets.googlecode.com/svn/trunk/w2b-recent-comments-w-gravatar.js"></script><script type="text/javascript" src="http://www.bunnycrazy.net/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=4"></script></div>

Você vai meche em praticamente nada no código, apena nas partes que destaquei, que vou explicar agora como se arrumar.

Vermelho: E o numero de comentários, que sera exibido nele
Laranja: Se desejar que os avatares não apareçam, altere o true para false.
Verde: Tamanho dos avatares, aumente o número ou diminua ate ficar da forma deseja.
Roxo: Se não quiser os avatares redondos, altere de true para false.
Azul: Quantidade de caracteres (letras), que ira aparecer a cada comentário feito.
Dourado: E a imagem padrão para anônimos, ou, se pessoa não tiver avatar.
Rosa: Altere de true para false, se não quiser mostrar os créditos do autor.
Negrito: Coloque a URL de seu blog ou site no local indicado, cuidado para não apagar os traços.

Nenhum comentário:

Postar um comentário