Una de las nuevas formas de cargar una pagina web o blog, es el scroll infinito, el cual consta en que a medida que se vaya bajando el contenido de un blog, mas contenido se ira cargando automáticamente  eliminando así la necesidad de tener que dar clics en los enlaces de paginación.

Este truco hará que el lector tenga una experiencia mucho mas amena e interactiva, ya que este sistema lo usan sitios de la talla de Facebook o Twitter.

Scroll infinito en Blogger


Para añadir el truco del scroll, no hay necesidad de tocar la plantilla, solo debes ir a Diseño, Añadir Gadget, HTML/JavaScript, y allí pega lo siguiente:

<script src='http://code.jquery.com/jquery-1.7.1.min.js' type='text/javascript'></script>
<script src='http://yourjavascript.com/4153098131/infinite-scroll-for-blogger-blogs.js' type='text/javascript'/></script>

Ahora solo resta guardar los cambios, y disfrutar de este genial truco 🙂

Puedes ver un demo el truco. Espero que les haya gustado este gran truco, y sigan visitando Mil Trucos Blogger.

Via/ Spice up your blog

Categorías: Trucos Blogger

54 commentarios

Iván Darío Agudelo A. · mayo 20, 2013 a las 7:19 pm

Hayder, espectacular este truco, muchas gracias joven.

Pilar Marcos · mayo 20, 2013 a las 8:59 pm

Funciona genial, gracias!

Accionglobal kike · mayo 20, 2013 a las 11:10 pm

Muchisimas gracias, muy útil y funcionamiento muy limpio

jose antonio garcia · mayo 21, 2013 a las 10:19 pm

no me funciona…

Pedro Fumero · mayo 22, 2013 a las 2:10 pm

A mi tampoco me funciona.

Miguel Lp · mayo 23, 2013 a las 7:09 pm

Excelente truco, gracias juvinao!!….en principio no entendía muy bien para que servia pero lo probé y funciona de maravilla..gracias de nuevo…Saludos!!

    Hayder Juvinao · mayo 25, 2013 a las 12:20 am

    Miguel gracias por tu comentario, este truco puede reemplazar perfectamente al de paginacion.

    Saludos

Andrés Felipe Lozano · mayo 24, 2013 a las 2:36 pm

no me funciona y no se que versión de jquery uso como hago ya que el blog no tiene paginación y no la he podido agregar y vi este truco que cumple casi la misma función pero no me funciona

    Hayder Juvinao · mayo 25, 2013 a las 12:21 am

    Andres si puedes indicarme cual es tu blog, con gusto te ayudare.

    Andrés Felipe Lozano · mayo 28, 2013 a las 5:55 am

    JUVINAO AYUDAME por favor :/ no puedo colocar ni paginación ni nada y no se que hacer ni siuiera el scroll infinito y además no me salen las opciones de entradas antiguan y anterior y siguiente y eso es muy funcional para navegar en mi blog me puedes ayudar por favor este es mi blog

    http://blogginred.blogspot.com/

    Hayder Juvinao · junio 5, 2013 a las 3:32 pm

    Andres el problema es de tu plantilla,tocaría revisar todo el código para ver si tiene el script que hace que los links de navegación funcionen, te recomiendo que mejor cambies de plantilla 🙁

    Saludos

Cocina Coco · mayo 25, 2013 a las 4:31 am

Hola!he probado con este script pero al tener entradas resumidas luego de mostrar 12 entradas en la pagina principal, (que es la cantidad que tengo seleccionadas a mostrar),no se ven las imagenes siguientes,osea que hace el efecto de scroll pero sin imagenes alguna solucion para este caso?
desde ya muchas gracias y saludos desde Argentina!

Cristian Bravo · mayo 25, 2013 a las 6:47 pm

Gracias Hayder por el truco eres un crack Saludos desde Canary Island

Programas Completos · mayo 27, 2013 a las 7:31 pm

EXCELENTE APORTE
MUCHAS GRACIAS!

Programas Completos · mayo 27, 2013 a las 7:31 pm

EXCELENTE APORTE
MUCHAS GRACIAS
MUY BUENA PAGINA

Programas Completos · mayo 27, 2013 a las 7:32 pm

EXCELENTE APORTE
MUCHAS GRACIAS!

Erik QR · junio 3, 2013 a las 4:38 am

para qué me sirve el Scroll? altera los datos de mi blog? responde porfa

    Hayder Juvinao · junio 5, 2013 a las 3:36 pm

    Erik es scroll puede reemplazar hasta cierto punto la paginacion, ya que con el con solo bajar la pagina se mostrara nuevo contenido.

Marim · julio 2, 2013 a las 5:51 pm

Excelente lo aplique a mi blog y funciono perfecto.

Entérate Cali · julio 27, 2013 a las 12:39 am

Hola, antes de nada decirte que es una excelente entrada y que los felicito por todos los trucos del blog =)

quisiera que me ayudaras, al instalar el truco del todo funciona perfecto en el pero me bloquea unos banner en slide que tengo, estos son 7 y rotan, al poner el scroll solo queda el 1ro y dejan de rotar, te adjunto el código de ese slide, haber si puedes ayudarme a que estos roten nuevamente.

https://dl.dropboxusercontent.com/u/31270671/Codigo%20slide.txt

QUE PENA ABUSAR DE LA CONFIANZA, PERO NO QUIERO DEJAR DE PONER EL SCROLL INFINITO =)

Entérate Cali · julio 29, 2013 a las 1:30 pm

Hayder, infinitas gracias por tu respuesta y por tu ayuda =)

mi blog es http://www.enteratecali.net/

    Hayder Juvinao · julio 29, 2013 a las 7:30 pm

    El slider que tienes usa Jquery al igual que el scroll, así que lo mas probable sea problema de las versiones de Jquery, prueba a poner solo una versión de Jquery, la mas avanzado.

    Hazlo y me cuentas que tal te fue.

    Saludos

Plácido Palmero Sierra · agosto 14, 2013 a las 8:15 pm

Hola, buenas noches. Me interesaría que el scroll infinito sólo funcionara en los post agrupados por etiquetas pero no los de la página principal y que estos post por etiquetas pudieran expandirse con «seguir leyendo» sin necesidad de cambiar de página, cosa que no se puede con esta función tal como está, queda inutilizado. ¿Es posible todo lo que te pregunto? Espero haberme explicado. Gracias.

Colegio Cristóbal Colón · agosto 21, 2013 a las 11:47 pm

¿Se puede modificar el texto «load more post»? No sólo cambiar las palabras, sino el fondo, el color. Es que tal como está ahora apenas se nota. Por cierto, ¿sería posible que en vez de aparecer nuevas entradas al bajar, aparecieran al hacer clic? Gracias.

    Hayder Juvinao · enero 4, 2014 a las 3:38 pm

    Editando el script, pero creo que es mejor dejarlo tal cual como lo hizo el autor.

    Saludos

CHABLE ABIGAIL · septiembre 2, 2013 a las 2:28 am

muy muy buen aporte

Mykel Amelinckx · diciembre 29, 2013 a las 7:07 am

hola amigo como lograr un scroll como el que tienes donde dice «Lo Último» y salen como noticias me gustaria por ejemplo que yo pueda tuitear algo y apareciera alli o que aparecieras las entradas del blog poco a poco una a una gracias

JESÚS · abril 29, 2014 a las 3:24 am

Nada, que no soy capaz, por mas que lo intento no soy capaz de que me salga como yo quiero. Sin pulsar en el tema… load more post… se me abren todas las entradas al completo, es decir, todo el texto de la entrada y lo que quiero es que lógicamente los usuarios pulsen en el texto si es que quieren ver mas entradas y de ser así, que las entradas salgan resumidas como así lo hacen las principales entradas del blog. He probado a ponerlo con y sin jquery.com/jquery-1.7.1… pero de ambas maneras y sin pulsar, tan solo con bajar directamente se abren todas las entradas completas………………… http://pruebasmakabi-1.blogspot.com.es/

El Chido · junio 15, 2014 a las 6:09 pm

muchas gracias, me servirá muchísimo

SoulChrona · diciembre 4, 2014 a las 2:19 pm

lo he incorporado, encaja perfecto para la forma de mi blog pero tengo un problema 🙁 a las entradas les elegí que imagen mostrar (para reducir el tiempo de carga) pero al añadir el scrip solo muestran las 6 primeras, el resto se muestra desordenadas debido a las diferentes resoluciones, como podría arreglar esto? ayuda por favor
este es el blog http://hikikogif.blogspot.com/

    Hayder Juvinao · diciembre 6, 2014 a las 5:26 pm

    Amigo antes de aplicar el truco del scroll, las entradas si cargaban bien?

      SoulChrona · diciembre 7, 2014 a las 12:48 am

      Claro, si le quito el scroll quedan alineadas y hasta con el resto de las entradas con la preview que elijo, pero al cargar todas las entradas el blog se demora en cargar y no puedo limitar el numero de entradas ya que la plantilla no lleva paginador (cuando lo hago solo muestra 6 entradas y el resto desaparece), por eso quiero el scroll infinito pero me da este fallo, me podrías ayudar? por favor! 🙁

    SoulChrona · diciembre 13, 2014 a las 12:12 am

    ayuda por favor ;((

    Hayder Juvinao · diciembre 13, 2014 a las 9:59 pm

    Amigo has probado modificando el CSS de tu plantilla?

    Me avisas a ver si te puedo ayudar.

    Saludos :p

Byron Quiñonez · enero 21, 2015 a las 7:03 am

Saludos, yo he probado ya muchas veces con lo compartido en diferentes webs a colocarle esto a un blog que manejo actualmente, pero hasta el momento nada funciona, simplemente no pasa nada.

¿alguna idea de porqué podría sólo no funcionar?
Desde ya, gracias por la ayuda. 🙂

El blog es http://kaoz-blog.blogspot.com/

    Hayder Juvinao · enero 21, 2015 a las 4:21 pm

    Amigo tu plantilla está muy personalizada y tal vez algunos de los códigos de tu plantilla hacen que el truco no funcione @@,

    Saludos

      Byron Quiñonez · enero 21, 2015 a las 4:42 pm

      Gracias por la respuesta, y perdona la molestia pero, ¿tienes idea de qué secciones de código pueden llegar a interferir con este truco?

        Hayder Juvinao · enero 23, 2015 a las 7:17 pm

        Este código usa la librería jQuery, tal vez ya hayas agregado la línea de esa librería en otro truco.

        Saludos

          Byron Quiñonez · enero 24, 2015 a las 2:07 am

          Muchas gracias por las respuestas (aún soy algo nuevo en el tema), te cuento, estoy trabajando en una nueva plantilla y este truco «funciona» pero con un pequeño problema, al cargar las nuevas publicaciones, resulta que al darles clic a las imágenes previas, las abre como imagen en vez de abrir la publicación.
          Además de esto, ahora me muestra toda la publicación en la vista previa, en ves de sólo el título y una de las imágenes como en la primer página de publicaciones.

          ¿tienes idea de qué pordía ser y cómo podría arreglarlo?

Miguel Figueroa · mayo 20, 2016 a las 12:55 am

Está chulo el tip, sin embargo al colocarlo en mi blog: http://latecnomega.blogspot.com/ funciona bien pero al cargar el resto de las entradas las carga completas, yo quiero que las cargue como están las anteriores, resumidas, si le puedes echar un vistazo y ayudarme por favor.

Deja un comentario

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