Cómo agregar desplazamiento infinito a su sitio de WordPress (paso a paso)

¿Quieres agregar scroll infinito a tu blog de WordPress?

El desplazamiento infinito es una técnica de diseño web que carga automáticamente el contenido de la página siguiente cuando los usuarios llegan al final de una página. Permite a los usuarios ver más contenido en su blog sin hacer clic en el diseño o en el botón “Cargar más”.

En este artículo, le mostraremos cómo agregar fácilmente desplazamiento infinito en su blog de WordPress (paso a paso).

¿Qué es Infinite Scroll?

El desplazamiento infinito es una tendencia de diseño web que utiliza la carga de páginas AJAX en lugar de la navegación por el número de página para cargar automáticamente el contenido de la página siguiente y mostrarlo al final de la página actual. El desplazamiento infinito facilita la navegación por más contenido con solo deslizar el dedo hacia abajo. Sube contenido de forma continua y sin fin a medida que los usuarios se desplazan.

Tradicionalmente, los usuarios tendrían que hacer clic en los botones “siguiente”, “anterior” o en los números de página para ver las publicaciones de blogs más antiguas.

Cuando se usa AJAX, abreviatura de Asynchronous Javascript y XML, las páginas web pueden comunicarse con el servidor sin recargar toda la página. Permite que las aplicaciones web procesen las solicitudes de los usuarios y proporcionen datos sin actualizar.

Los mejores ejemplos de diseños de desplazamiento sin fin son los sitios de redes sociales populares como Facebook, Twitter, Instagram, Pinterest y otros. Si está utilizando alguno de ellos, entonces sabe cómo el contenido se carga sin cesar en su historial de redes sociales.

¿El desplazamiento infinito es adecuado para todos los sitios web?

Muchos sitios web de contenido en Internet utilizan la técnica de desplazamiento infinito para mejorar la experiencia de navegación y aumentar la participación. Esto lleva a muchos principiantes a hacer preguntas: ¿cómo es adecuado para cada sitio web o es bueno para mi sitio?

El desplazamiento infinito es excelente para sitios que presentan contenido en una línea de tiempo o en un feed, como las aplicaciones de redes sociales. Ofrece una excelente experiencia de navegación a los usuarios que buscan contenido basado en el tiempo.

A continuación, el diseño de desplazamiento infinito es perfecto para dispositivos móviles y táctiles. Para los usuarios de dispositivos móviles, el desplazamiento es más fácil de usar que grabar pequeños enlaces de página.

Interacción web con pantalla táctil

El beneficio más significativo de la técnica de desplazamiento infinito es una experiencia de navegación fluida. Los usuarios no tienen que hacer clic manualmente en los enlaces de paginación. El contenido se carga rápidamente con el desplazamiento y mantiene a los usuarios interesados.

Pero, por otro lado, también puede hacer que su sitio sea más difícil de navegar. Con la carga continua, es difícil saber dónde (en qué página) se encuentra una publicación de blog. Algunos usuarios incluso encuentran abrumador ver muchos artículos a la vez.

Otro inconveniente del diseño de desplazamiento infinito es que no puede tener un pie de página. Incluso si lo tiene, estará oculto bajo un sinfín de artículos cargados continuamente. Muchos sitios agregan enlaces esenciales al pie de página, por lo que no tenerlos puede decepcionar a algunos usuarios.

Quizás el problema más preocupante con el desplazamiento infinito es que puede ralentizar su sitio web o incluso bloquear su servidor. Cuando agregamos el desplazamiento infinito a uno de nuestros blogs más pequeños, experimentamos un bloqueo del servidor después de que los usuarios se desplazaran innecesariamente y se quedara sin memoria en una pequeña cuenta de alojamiento de WordPress. Recomendamos utilizar un alojamiento administrado de WordPress si está buscando experimentar un desplazamiento infinito.

Ahora que conoce los pros y los contras del diseño de desplazamiento infinito, puede decidir si agregarlo a su blog o no.

Si ha decidido agregar desplazamiento infinito a su blog de WordPress, puede hacerlo fácilmente. Te mostraremos más plugins que puedes utilizar, para que elijas el que mejor se adapte a tus necesidades.

Si no le gusta el video o necesita más instrucciones, siga leyendo.

Agregue Infinite Scroll a su blog de WordPress con Catch Infinite Scroll

Lo primero que debe hacer es instalar y activar el archivo. Captura de desplazamiento infinito conectar. Para obtener más detalles, consulte nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.

Tras la activación, WordPress agregará un nuevo elemento de menú llamado “Catch Infinite Scroll” al panel de administración de WordPress. Debe hacer clic en él para configurar los ajustes del plugin.

Captura configuraciones de desplazamiento infinitas

Primero, puede elegir una opción de activación para cargar artículos. El plugin le permite cargar contenido automáticamente cuando los usuarios se desplazan hacia abajo en la página o agregan un botón “Cargar más”.

Cargar al desplazarse o hacer clic: captura la configuración del plugin de desplazamiento infinito

Debe seleccionar la opción “Desplazamiento” para habilitar la carga automática con desplazamiento. Alternativamente, puede seleccionar la opción “Hacer clic” si desea agregar un botón Cargar más.

A continuación, puede ver el selector de navegación, el selector siguiente, el selector de contenido y el selector de elementos. No necesita cambiar nada en estas opciones porque las opciones predeterminadas funcionan bastante bien.

Después de eso, hay una opción de Imagen donde puede agregar el ícono del cargador de contenido. Por defecto, tiene una imagen GIF del cargador. Si tiene una imagen mejor, puede cambiarla.

Sube una nueva imagen de carga para WordPress Infinite Scroll

La opción “Texto final” incluye el mensaje que se mostrará una vez que el usuario haya terminado de ver sus artículos. De forma predeterminada, el texto dice “No hay más elementos para mostrar”. Puede editar fácilmente este texto según sea necesario.

Carga de artículos terminados - Opción de texto final Capturar desplazamiento infinito

Cuando termine, haga clic en el botón Guardar cambios.

¡Eso es todo! El desplazamiento infinito ahora está activo en su blog. Puede visitar su blog y ver el desplazamiento infinito en acción.

Vista previa de desplazamiento infinito de WordPress

Plugins alternativos de WordPress para agregar desplazamiento infinito en WordPress

Catch Infinite Scroll funciona bien con la mayoría de los temas de WordPress; sin embargo, puede fallar con algunos temas. En tal escenario, puede utilizar uno de los siguientes plugins de WordPress de desplazamiento infinito.

1. Ajax Cargar más

Ajax Cargar otras configuraciones

Similar a Catch infinite Scroll, el plugin Ajax Load More también le permite agregar scroll infinito y botones Load More en los que se puede hacer clic en su sitio de WordPress.

El plugin ofrece múltiples opciones de personalización, incluidos muchos estilos de iconos de carga de página, estilos de botones, etc. Para obtener una guía detallada, puede ver nuestro tutorial sobre cómo crear un botón Cargar más publicaciones en WordPress utilizando el plugin Ajax Load More.

Sin embargo, el plugin tiene una curva de aprendizaje para principiantes. Tiene una interfaz avanzada con muchas opciones, incluido el patrón de repetición, el generador de código corto, la consulta de WordPress y más.

Se necesitarán algunas habilidades de codificación para aplicar el desplazamiento infinito con este plugin.

2. YITH Desplazamiento infinito

YITH Infinite Scrolling es una alternativa simple al plugin Ajax Load More o Catch Infinite Scroll.

Al igual que el plugin Catch Infinite Scroll, tiene opciones mínimas para configurar la interacción web basada en desplazamiento en su sitio. Solo necesita instalar y activar el plugin y habilitar el desplazamiento infinito.

YITH configuración de plugin de desplazamiento infinito

Cualquiera, incluidos los principiantes, puede configurar fácilmente el desplazamiento infinito con este plugin. Sin embargo, no tiene una opción de botón “Cargar más”, que se incluye en los otros dos plugins mencionados anteriormente.

Esperamos que este artículo le haya ayudado a aprender cómo agregar un diseño de desplazamiento infinito a su blog de WordPress. También puede consultar nuestra guía sobre cómo agregar seguimiento de profundidad de desplazamiento en WordPress.

¿Te ha resultado útil??

0 / 0

Deja una respuesta 0

Tu dirección de correo electrónico no será publicado. Required fields are marked *