Mil Trucos Blogger

Gadget de Últimos Comentarios con efecto Slider

Deja tu Reacción sobre el artículo
Me Gusta Dichoso Feliz Admirado Triste Enojado

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.

0
Shares

Relacionados...

Deja tu Reacción sobre el artículo
Me Gusta Dichoso Feliz Admirado Triste Enojado

69 Comentarios

  1. Septiembre 8, 2013    

    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.

    • Septiembre 11, 2013    

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

      Haz los pasos nuevamente 😉

      Saludos

  2. Septiembre 9, 2013    

    esta template tambien la tengo yo!!!

  3. Anonymous Anonymous
    Septiembre 9, 2013    

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

  4. Septiembre 11, 2013    

    Seguramente no ponen bien la URL de su blog.

  5. Septiembre 12, 2013    

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

    • Septiembre 14, 2013    

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

      Saludos

  6. Septiembre 15, 2013    

    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

    • Septiembre 22, 2013    

      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

  7. Septiembre 20, 2013    

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

    Un saludito 🙂

    • Septiembre 22, 2013    

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

      Y como tu lo dijiste es completamente personalizable.

      Saludos

  8. Septiembre 22, 2013    

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

    • Septiembre 22, 2013    

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

      • Agosto 29, 2014    

        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)

  9. Septiembre 23, 2013    

    Muchas gracias me funciono perfectamente.

  10. Septiembre 30, 2013    

    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.

    • Septiembre 30, 2013    

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

      Saludos

    • Octubre 11, 2013    

      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

  11. Octubre 16, 2013    

    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.

  12. david hyde david hyde
    Octubre 26, 2013    

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

  13. david hyde david hyde
    Octubre 26, 2013    

    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

  14. Alvaro Alvaro
    Noviembre 4, 2013    

    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

  15. Anonymous Anonymous
    Noviembre 18, 2013    

    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.

    • Noviembre 22, 2013    

      Amigo en cual blog no funciona el truco?

      Saludos

  16. Diciembre 20, 2013    

    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.

    • Enero 4, 2014    

      Abel este truco es incompatible con el que mencionas.

      Saludos

  17. Enero 2, 2014    

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

  18. Enero 12, 2014    

    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/

    • Enero 23, 2014    

      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

  19. Febrero 4, 2014    

    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

    • Febrero 18, 2014    

      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.

    • Marzo 12, 2014    

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

      Saludos

  20. Febrero 18, 2014    

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

  21. Marzo 1, 2014    

    No puedo ponerlo 🙁 podrías ayudarme?

  22. Abril 3, 2014    

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

    • Abril 12, 2014    

      Amigo en que blog se presenta este problema?

      Saludos

  23. Abril 9, 2014    

    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 !!!!

    • Abril 12, 2014    

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

      numComments = 15

      Saludos

  24. Omi Omi
    Abril 15, 2014    

    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

    • Abril 15, 2014    

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

      Saludos y bendiciones para ti :>)

  25. Abril 18, 2014    

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

  26. Mayo 12, 2014    

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

  27. Mayo 26, 2014    

    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!

  28. Julio 9, 2014    

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

  29. Julio 18, 2014    

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

  30. Julio 18, 2014    

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

  31. Agosto 28, 2014    

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

    • Agosto 28, 2014    

      Federico que bueno que te haya funcionado.

      Saludos

  32. Anonymous Anonymous
    Septiembre 5, 2014    

    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ó???

    • Septiembre 6, 2014    

      A mi me ha ocurrido lo mismo. ¿Alguien sabe por qué se borró?

  33. Anonymous Anonymous
    Septiembre 6, 2014    

    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!

    • Septiembre 6, 2014    

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

    • Septiembre 7, 2014    

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

    • Septiembre 8, 2014    

      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.

  34. Septiembre 10, 2014    

    Muchas Gracias funcionamiento 100%

  35. Octubre 16, 2014    

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

  36. Octubre 20, 2014    

    lo mismo de arriba dejo de funcionar :/

  37. Enero 9, 2015    

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

  38. Anonymous Anonymous
    Marzo 5, 2015    

    Amigo que blog tan genial

Deja un comentario

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

Categorías

Síguenos en Facebook

Suscribete por Email

Introduce tu Correo:

Recibiras nuestros últimos posts en tu correo