04 marzo 2012

Comentarios Recientes con Avatar redondo

Gracias a un script,  en Blogger es posible agregar los comentarios recientes con un avatar redondo en nuestro blog de forma muy sencilla y rápida.

Para colocar los últimos comentarios en tu blog puedes seguir los siguientes pasos:

1.- Diseño - añadir gadget y colocáis el código en su interior
2.- Cambiamos la parte que dice: NOMBRE DE TU BLOG por la vuestra.
3.-Guardamos cambios y listo
<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:#ccc;-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: #000;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
// Recent Comments Settings
var
numComments = 10,
showAvatar = true,
avatarSize = 32,
roundAvatar = true,
characters = 50,
showMorelink = true,
moreLinktext = "Más &#187;",
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.nombre-de-tu-blog.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=10"></script>

El script se puede modificar si observáis bien el código, si tenéis problemas en su instalación, comentario y trato de solucionar.
Si el script deja de funcionar, cambiar esta dirección: http://widgets.way2blogging.org/blogger-widgets/w2b-recent-comments-gravatar.js por esta otra: https://googledrive.com/host/0BwZ7Sm1QQc1lTnlVZG1DS3V0N3c/ultimoscomentarios.js

<----------- A DISFRUTARLO ---------->

11 comentarios

Lo voy a poner en mi blog Antonio.Muy bueno. Te espero en mi blog. Saludos!!

No me funciona. Miraré a ver si no he hecho algo bien.

Muchísimas gracias, me ha servido un monton.

como pongo los comentarios como los tienes tu en tu blog, gracias de ante mano.

Norlan, copia de nuevo el código, lo he actualizado.

Gracias habia dejado me habia de funcionar y ya vuelve a ir .
Saludos :)

Se ve estupendo pero los comentarios anónimos teniendo avatar no aparecen con la imagen puede lograrse?Otra pregunta me encanta como giran los avatares en tus comentarios,serías tan amable de indicarme como se logra ese giro? y así pondría las dos cosas en mi blog.
Gracias

Localiza, para hacer girar los avatares debes colocar el siguiente código en el CSS de tu plantilla:
.comments .avatar-image-container :hover {-moz-transform: rotate(300deg);-webkit-transform: rotate(300deg);transform: rotate(300deg);-moz-transition: all 1s; -webkit-transition: all 1s; transition: all 1s;}

Muchas gracias, funciona a la perfección

Oooh, genial! muchas gracias! Me dejo de funcionar, pero cambié lo que has indicado y ahora si que va :) Por cierto, como puedo cambiar el fondo gris de cada avatar? Gracias!

Hola Antonio;
Hace tiempo instalé tu widget en mi blog y hasta hace una semana funcionaba la mar de bien (con el cambio que mencionaste de script) pero ahora no hay manera de que se vean los avatares de comenterios recientes. ¿Tú sabes como lo podemos solucionar? Muchas gracias.


Por favor, comente de acuerdo al tema del artículo.
Serán removidos todos los Comentarios con enlaces.
Si quieres recibir los nuevos comentarios marca "Avisarme"