Cómo agregar desplazamiento infinito a tu blog de WordPress

Mientras hablaba con Matt Mullenweg en WordCamp Atlanta, nos dijo que estaban agregando un desplazamiento infinito a algunos sitios web de socios VIP en WordPress.com porque los resultados eran asombrosos. Sugirió que deberíamos intentar agregar eso a nuestro proyecto List25. Bueno, después de investigar un poco, descubrimos que era muy fácil implementarlo. Nos llevó menos de 1 minuto instalar Infinite Scroll en WordPress. En este artículo, le mostraremos cómo usted también puede instalar Infinite Scroll en WordPress.

Actualización: Hemos eliminado este complemento de nuestro sitio. Durante los tiempos de alto tráfico, esto causó que nuestros servidores se bloquearan. Cada vez que muchos usuarios comenzaban a hacer un desplazamiento infinito, notábamos que nuestra memoria estaba agotada, lo que hacía que el servidor no respondiera. Esto probablemente funcionaría muy bien para sitios más pequeños.

Que es Infinite Scroll?

Tradicionalmente, el usuario tendría que hacer clic en la página siguiente o en la página anterior para visitar el contenido de una publicación anterior. Sin embargo, recientemente hay una nueva tendencia iniciada por sitios populares (como Facebook y Twitter) en la que se carga automáticamente el contenido de la página siguiente una vez que el usuario llega al final de la publicación. Esta técnica ha demostrado que muestra un aumento en el tiempo que el usuario pasa en la página porque el nuevo contenido se carga automáticamente..

Si usa Facebook o Twitter, ya ha visto la vista previa en vivo de esto. Sin embargo, si desea ver cómo se ve esto en un sitio de WordPress, consulte List25.

Cómo agregar desplazamiento infinito en WordPress

Lo primero que debes hacer es instalar y activar el complemento Infinite Scroll.

Al activarse, se agregará una nueva opción de menú en la pestaña de configuración llamada Infinite Scroll. En casi el 90% de los sitios de blogs, esto debería funcionar sin cambiar una sola configuración. Sin embargo, si tiene un blog diseñado especialmente personalizado, deberá ajustar los "selectores". Vaya a la página de configuración del complemento y haga clic en la pestaña de selectores.

El complemento precargará los selectores en función de los estándares. El selector de contenido sería el div que envuelve su contenido en la página principal. En nuestro tema, fue #contenido. Esto es muy estándar y la mayoría de los autores lo usan. No tuvimos que cambiar esta parte. El Selector de publicaciones de forma predeterminada era #content div.post, que es estándar en la mayoría de los sitios de blogs, sin embargo, envolvemos nuestras publicaciones con un div adicional llamado .post-container. Esto nos permite dividir nuestra miniatura y el contenido del sitio en dos cuadrículas separadas. Cuando instalamos el complemento por primera vez, el complemento funcionó, sin embargo, no estaba cargando nuestras miniaturas. Resultó que la razón por la que no estaba cargando miniaturas era que el selector de posts no era lo que queríamos.

Para el selector de navegación y el selector de página siguiente, lo más probable es que no tenga que cambiarlo porque son parámetros muy estándar y casi el 99% de los temas lo utilizan (o eso esperamos).

En la pantalla de opciones generales, puede personalizar la carga de la imagen, la carga de texto, el texto final, etc..

Este es un complemento muy bueno que acabamos de instalar. Si desea agregar un desplazamiento infinito a su sitio, este complemento es para usted.

Es importante tener en cuenta que esto solo funciona en la página de inicio de su blog. No funcionará en las páginas de categoría / etiqueta de archivo..

Obtener Infinite Scroll plugin