Hace unos días haciendo unas pruebas pude añadirle exitosamente al gadget de últimos comentarios el famoso efecto slider, y hoy lo compartiré con todos ustedes.

Vista Previa del gadget (lo pueden ver en el sidebar de blog ahora mismo).

Para añadir a sus blogs este espectacular gadget, solo debes ir a Diseño, Añadir Gadget, HTML/JavaScript y pega allí lo siguiente:

<marquee direction="up" scrollamount="3" style="background- text-align: left; width:280px;height:340px;border:0px solid #000000;padding:3px" onmouseover="this.scrollAmount='3'" onmouseout="this.scrollAmount='3'">
<br/><style type="text/css"></style>
<script type="text/javascript">
//<![CDATA[
    // Recent Comments Settings
    var
 numComments  = 15,
 showAvatar  = true,
 avatarSize  = 40,
 roundAvatar = false,
 characters  = 60,
 showMorelink = false,
 moreLinktext = "More &#187;",
 defaultAvatar  = "https://lh3.googleusercontent.com/-RIC-7Z86S0E/UPYX-7IVLuI/AAAAAAAABTk/qx1fLgBjaJk/s40/user.png",
 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://nombre-de-tu-blog.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=15"></script></marquee>
<style type="text/css">    ul.w2b_recent_comments{list-style:none;margin:0 0 15px 0;padding:0; background:none;width:100%}    .w2b_recent_comments li{background:#A9D0F5 !important;padding:3px 4px 3px 0!important;display:block;clear:both;overflow:hidden;list-style:none;margin:5px 0; border:1px dashed #fafafa}     .w2b_recent_comments li .avatarImage{padding:2px;border:1px solid #e7e7e7;background:#fff;float:left;margin:0 4px 7px 3px;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{text-shadow:1px 1px 1px #fff;margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;padding:2px 0 6px 0;line-height: 1.2} .w2b_recent_comments li a{color:#064f4c;text-shadow:1px 1px 1px #fff}.w2b_recent_comments li a:hover{margin-left:4px;}</style>

Ahora solo debes reemplazar la parte resaltada en azul por el nombre de tu blog y listo, guarda los cambios.

Es un truco muy fácil de agregar y que le dará a tu blog un toque de profesionalismo y elegancia único.

Cuéntame si te ha sido de utilidad y como te ha parecido este gran truco.


69 comentarios

Oralia Copado · septiembre 8, 2013 a las 5:51 pm

Hola!!muchas gracias por todos sus consejos para mejorar un blog, en lo particular muy agradecida. En relación a este de añadir los últimos comentarios, lo hice y aparece en mi blog sólo que aparece en blanco, no se, si es porque no tenga comentarios o quizá porque los comentarios no los ha podido hacer mi público porque se dirigen a mi correo y para eso hay que seguir varios pasos de seguridad, ya intenté hacerlo de otra forma peor no se cómo deba hacerse.

    Hayder Juvinao · septiembre 11, 2013 a las 4:18 pm

    Oralia pero a mi si me ha servido, mira que lo uso en mi blog y va de maravilla.

    Haz los pasos nuevamente 😉

    Saludos

ESP RAFITA · septiembre 9, 2013 a las 2:02 pm

esta template tambien la tengo yo!!!

Anonymous · septiembre 9, 2013 a las 8:45 pm

¡ Hola ! Soy Antonio y lo pongo en mi blog y no sale nada si me puedes ayudar ¿el porqué de no salir?. Un saludo

Hayder Juvinao · septiembre 11, 2013 a las 4:24 pm

Seguramente no ponen bien la URL de su blog.

jarckol Izul · septiembre 12, 2013 a las 12:09 am

graciasssssss lo esperaba… saludos :alaba: :alaba: :alaba:

    Hayder Juvinao · septiembre 14, 2013 a las 2:43 pm

    Que bueno jarckol, espero que lo pongas en tu blog 😉

    Saludos

Loko Ser · septiembre 15, 2013 a las 2:49 am

Gracias Hayder esta genial lo modificaste los comentarios dejandolo como movimiento :). Ya lo agrege. solo tube que subirle el numero en una parte del codigo del avatar ya ke no se me veian completos los avatares. Pero ya kedo xD

    Hayder Juvinao · septiembre 22, 2013 a las 9:03 pm

    Loko Ser, este era un truco que quería desde hace rato pero no lo había podido hacer hasta que un día lo logre.

    Por cierto eres muy bueno con los códigos 😉

    Saludos

Namir Criollo · septiembre 20, 2013 a las 1:48 am

Muchas gracias Hayder, funciona perfectamente y lo que más me gusta es que se puede personalizar por completo.

Un saludito 🙂

    Hayder Juvinao · septiembre 22, 2013 a las 9:05 pm

    Namir que bueno que te haya funcionado, así queda demostrado que el tutorial si sirve.

    Y como tu lo dijiste es completamente personalizable.

    Saludos

Ana Victoria Lagos · septiembre 22, 2013 a las 6:47 pm

yo le puse la direccion de mi blog en blogger pero no funciona!

    Hayder Juvinao · septiembre 22, 2013 a las 9:15 pm

    Cual es la URL de tu blog, así podre decirte que debes poner exactamente.

      SDLN · agosto 29, 2014 a las 5:33 pm

      Hola! estoy poniendolo pero quiero personalizarle el color! ¿Como hago? Respondeme en mi blog, Me encanta el tuyo, me veras aqui muy seguido! pero respondeme primero asi me ayudas, click en mi perfil yt veras mi blog SDLN (SAGA)

Jose Antonio Florentino · septiembre 23, 2013 a las 7:08 pm

Muchas gracias me funciono perfectamente.

elvencejodemieresduerme · septiembre 30, 2013 a las 7:51 am

Perfecto! Estuve buscando esto y de los que miré, sólo me funcionó el tuyo. Además me gustan los colores que ya tiene, por lo tanto no cambio nada.

Muchísimas gracias majo.

    Hayder Juvinao · septiembre 30, 2013 a las 8:48 pm

    Que bueno que te haya servido y lo mejor: que te haya gustado.

    Saludos

    Abel Martinez · octubre 11, 2013 a las 4:17 am

    buenisimo el slider excelentisimos, me gustaria que hiciera uno pero que en el fondo azul en borde llevara como sombra negra como un resplandor se puede o no

Ismael Sánchez · octubre 16, 2013 a las 1:45 pm

Excelente Gadget.

Lo acabo de poner en mi blog y me encanta. Al principio me aparecía en blanco como a muchos usuarios que han comentado este post. Resulta que en la plantilla que nos indicas has puesto lo siguiente -> http:/nombre-de-tu-blog.blospot.com . Al añadir otra «/» despues de http: y al añadir una «g» en la palabra bloGspot me funcionó a las mil maravillas.

Como siempre, muchas gracias por tus soluciones. Un saludo.

david hyde · octubre 26, 2013 a las 10:26 am

hola lo pego en mi blog pero no me sale nada se queda en blaco el hueco

david hyde · octubre 26, 2013 a las 10:31 am

me puedes ayudar xfa pongo los codigos en mi blog pero se keda en blaco mi url es
monsterpruebas.blogspot.com
es solo un blog de pruebas para luego hacer el bueno
gracias

Alvaro · noviembre 4, 2013 a las 12:29 am

Muy buen tutorial pero la parte para dejar el url del blog esta mal, falta un / y ademas dice blospot, deberia decir blogspot. Gracias por el tip, me sirvio mucho

Anonymous · noviembre 18, 2013 a las 7:55 pm

Lo pruebo añadiendo «/» y la «g» que falta, pero sale en blanco. Ha que puede ser debido.Porque tengo comentarios y no sale nada.

Abel Jara Romero · diciembre 20, 2013 a las 11:10 am

Desde que he añadido la caja de comentarios en la que se puede elegir si comentar mediante Google+, Blogger o Facebook, me ha dejado de funcionar, se ha quedado en blanco. Hasta entonces, lo puse en cuanto lo vi y funcionaba correctamente (muy bueno, por cierto). Dime qué puede ser. Muchas gracias.

Bufete Abogados madrid · enero 2, 2014 a las 9:16 am

Mi pregunta es, ¿con ese widget incrementan los enlaces externos de tu blog?
porque de ser asi, afectara a tu SEO

Carmen Cardeñosa · enero 12, 2014 a las 9:44 pm

Genial! Lo he puesto en mi blog y funciona perfectamente solo que lo he tenido que modificar porque se salía del diseño, de modo que en «background:none;width:100%} he cambiado el porcentaje por 60 y que da justo como yo quería.
Dos preguntas ¿Se pueden quitar las fotos de los que comentan?¿Se puede ralentizar un poco?.Un millón de gracias. Aquí mi blog por si lo quieres ojear: http://carmen-jugandoyaprendiendo.blogspot.com.es/

    Hayder Juvinao · enero 23, 2014 a las 7:25 pm

    Carmen eres muy hábil con los códigos 🙂

    Si quieres el gadget de los últimos comentarios sin avatar, aquí en el blog hay varios artículos con mas opciones de las cuales puedes escoger la que mas te guste.

    Saludos

mariona rubio · febrero 4, 2014 a las 9:08 am

Gracias por el gadget, solo una duda, me aparecen solamente los comentarios de los primeros días del blog (hace 8 meses), tendría que haber cientos y siempre aparecen los 15 primeros.

Donde pone: recent comments 15

el 15 lo cambié por 100 a ver si aparecían los últimos y nada, solo aparecen los 15 primeros.

Tienes idea de por que sucede? ¿qué podría modificar? Par que me aparecieran los últimos y no los primeros

muchas gracias
Mariona

    Loli · febrero 18, 2014 a las 3:51 pm

    Prueba a cambiar esta línea numComments = 15, también en la linea 19 hay otro max-results=15. Quizá cambiando los dos te salgan todos.

    Hayder Juvinao · marzo 12, 2014 a las 11:37 pm

    Amigo Mariano te recomiendo que no pongas mas comentarios porque puede hacer que tu blog cargue mucho mas lento [-(

    Saludos

Loli · febrero 18, 2014 a las 3:48 pm

Joé que estupendo (h) ¡Me lo pido para reyes! ^^

Huganti Kuri · marzo 1, 2014 a las 6:33 am

No puedo ponerlo 🙁 podrías ayudarme?

Iván Segurado · abril 3, 2014 a las 12:43 pm

Lo he puesto en mi blog pero no aparece. Esta un espacio donde debería totalmente negro. me ayudas?

Joralgom Joral · abril 9, 2014 a las 4:42 pm

Saludos Hayder… mira pasa lo siguiente agregue el gadget de comentarios que esta en esta pagina no me deja modificar el valor total de los comentarios.. siempre me quedan en 5… no deja poner 10 o 15 .. alguna solucion?.. de antemano gracias y un gusto volver a saludarte !!!!

    Hayder Juvinao · abril 12, 2014 a las 3:41 pm

    El numero de comentarios por defecto del gadget es 15 y lo puedes cambiar en la linea:

    numComments = 15

    Saludos

Omi · abril 15, 2014 a las 2:58 pm

Muchas Gracias: me frustró cuando blogger desactivó su gadget de últimos comentarios y fue una maravilla hallarte porque pude ponerlo yo solita y me salió muy bien, ya que soy una señora de otra época, te felicito y agradezco enormemente tu ayuda, Dios te bendiga. Shalom

    Hayder Juvinao · abril 15, 2014 a las 5:04 pm

    Omi gracias por comentar, me gratifica mucho que mi trabajo pueda ayudar a personas como tu.

    Saludos y bendiciones para ti :>)

Nitro Sonic · abril 18, 2014 a las 10:24 am

Amigo como cambio el estilo de fondo por una de mi preferencia osea que yo lo haga

masterradioweb · mayo 12, 2014 a las 8:54 pm

va super bienn y sino mirar vosotros mismos: http://recordandobicicletaszeus.blogspot.com.es/

Graciela · mayo 26, 2014 a las 5:33 am

Hola, buenas noches 🙂
Me encantó este gadget. Tengo un foro y los Últimos temas así aparecen en la columna lateral, con un marquee, y este gadget me cayó de maravilla para el blog.
Los comentarios van un poco rápido, pero está bien, para que no se haga tedioso el estar esperando que aparezcan todos; sin embargo, era difícil seleccionarlos a esa velocidad, de manera que le modifiqué para que se pudiera parar al poner el cursor encima. Por si a alguien le interesa, cambié estas líneas → onmouseover=»this.scrollAmount=’3′» onmouseout=»this.scrollAmount=’3′»
por éstas → onmouseover=»this.stop()» onmouseout=»this.start()»
Muchísimas gracias por el aporte, ¡Dios te bendiga, Hayder!

Toñi Garcia · julio 9, 2014 a las 3:31 pm

Me ha encantado…gracias por compartir. mira que bien ha quedado…http://sonriendoporlavida.blogspot.com.es/
Un saludo

Susumiya Haruhi · julio 18, 2014 a las 2:07 am

Que genial y que fácil, muchísimas gracias 😀

Localiza Recursos Sociales · julio 18, 2014 a las 6:10 pm

y para los blogs privados???Conoces como añadir los últimos comentarios?

Federico Ballinas · agosto 28, 2014 a las 5:13 am

Genial!!!! Lo puse en mi blog y funciona a las mil maravillas

Anonymous · septiembre 5, 2014 a las 3:12 pm

Amigo, hace 3 meses que lo puse y me funcionó muy bien, pero desde ayer me dejó de funcionar y se borró de mi blog.
Sabés que pasó???

Anonymous · septiembre 6, 2014 a las 1:47 pm

Hola, soy el anonimo del 5 de septiembre.
Ya encontré la solución.
En el codigo hay que reemplazar la parte donde dice : «http://widgets.way2blogging.org/blogger-widgets/w2b-recent-comments-gravatar.js»
Por: «https://googledrive.com/host/0BwZ7Sm1QQc1lTnlVZG1DS3V0N3c/ultimoscomentarios.js»
Y listo. Saludos!

    Carmen Cardeñosa · septiembre 6, 2014 a las 7:27 pm

    Gracias Anónimo. Yo también he conseguido arreglarlo. Un saludo 😉

    CocinaBlogGemma · septiembre 7, 2014 a las 6:36 pm

    Muchas gracias, me pasaba lo mismo y he podido solucionarlo.

    Abel Jara Romero · septiembre 8, 2014 a las 2:57 pm

    Gracias, Anónimo, desde hace unos días me pasaba igual y ya vuelve a funcionar.

    Un abrazo.

    PD: Hayder, hace un tiempo, por este mismo hilo, me dijiste que era incompatible este gadget con el que hace posible elegir comentar por Blogger, Facebook o Google+. Hacerte saber que tengo ambos puestos y funcionan en conjunto 😉 Un abrazo.

Mauricio Orden · septiembre 10, 2014 a las 2:38 pm

Muchas Gracias funcionamiento 100%

Luis Reyes · octubre 16, 2014 a las 5:12 pm

Amigo creo que el scrit dejo de funcionar lo tengo en mi blog y derrepente dejo de aparecer amigo

jose raul · octubre 20, 2014 a las 1:53 pm

lo mismo de arriba dejo de funcionar :/

JcDuranM · enero 9, 2015 a las 4:24 am

hola amigo me podiras decir como cambar el fondo azul por una imagen

Anonymous · marzo 5, 2015 a las 7:02 pm

Amigo que blog tan genial

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *