Agregue desplazamiento infinito al feed de publicaciones en WordPress - Calendae | Informática, Electrónica, CMS, Ciberseguridad

Agregue desplazamiento infinito al feed de publicaciones en WordPress

Hola otra vez. Te escribe Samuel López y esta vez te voy a hablar sobre Agregue desplazamiento infinito al feed de publicaciones en WordPress

A los propietarios de blogs y de sitios de noticias les encanta mantener a sus lectores interesados. Es decir, intentan mantener al usuario enfocado en el contenido, para no salir del sitio.

Muchos blogs utilizan un efecto de desplazamiento infinito para mostrar publicaciones y artículos (tipos de publicaciones personalizados) en sus sitios de WordPress. Esta técnica se utiliza para generar clics del lector. Parece el feed de todas las redes sociales conocidas, quizás por eso es tan popular.

El plugin Ajax Load More para WordPress proporciona esta funcionalidad. Luego puedes mejorarlo a tu gusto, a través de las opciones de configuración disponibles.

¡Siga leyendo para aprender a usar este plugin!

Paso 1. – Instale el plugin

Estoy trabajando en una instalación local de WordPress, por lo que estoy instalando el plugin a través de la terminal, debido a la falta de credenciales FTP en una máquina local.

  • Abierto la aplicación de terminal del sistema y coloque el cursor en el directorio / wp-content / plugins.
  • género: wget https://downloads.wordpress.org/plugin/ajax-load-more.zip

Esto descargará un archivo zip del repositorio de plugins de WordPress.org.

  • género: descomprimir ajax-load-more.zip

Esto descomprimirá el archivo y colocará un directorio llamado ajax-load-more dentro del directorio de plugins.

Un último paso es eliminar el archivo comprimido, que ya no es necesario.

rm ajax-load-more.zip

  • Abierto su panel de WordPress.
  • Hacer clic Enchufar.
  • Localizar los Ajax Cargar más conectar.
  • Hacer clic Activar.

Cómo agregar desplazamiento infinito al feed de publicaciones en WordPress


Paso 2. – Crea un shortcode

El plugin funciona con un código corto que puede incrustar en sus publicaciones, widget o bloque de Gutenberg.

  • Hacer clic Ajax más cargado > Generador de shortcode

La pantalla de configuración parece un poco abrumadora, debido a las muchas opciones disponibles.

  • Hacer clic los Comprimir todo en el lado derecho en la parte superior de la lista.

Cómo agregar desplazamiento infinito al feed de publicaciones en WordPress

Aquí tienes 3 áreas principales de configuración:

  • Configuración de pantalla
  • Parámetros de consulta
  • Integraciones

los Configuración de pantalla el área controla la apariencia de la salida, es decir, cómo los lectores verán el efecto «cargar más» en sus pantallas.

Cómo agregar desplazamiento infinito al feed de publicaciones en WordPress

  • Hacer clic los Opciones lengüeta.
  • Cambio los Estilo de carga de botones para llenar el círculo.

Cómo agregar desplazamiento infinito al feed de publicaciones en WordPress

  • Diapositiva abajo y cambiar el «Destruir después«Opción a 10.

Esto significa que la funcionalidad Ajax se ejecutará (actualizará y presentará una lista de elementos nuevos) 10 veces. El valor 0 significa que el efecto Ajax se ejecutará para siempre.

También tenga en cuenta que existe la posibilidad de agregar clases CSS personalizadas al contenedor que contiene los elementos de la lista y el código abreviado que se genera en la columna de la derecha, cada vez que cambia alguna configuración.

Cómo agregar desplazamiento infinito al feed de publicaciones en WordPress

El plugin está muy bien documentado, puede buscar más sobre cada opción haciendo clic en «?» símbolo junto a cada uno de ellos.

  • Hacer clic los Parámetros de consulta pestaña para abrirlo.

Cómo agregar desplazamiento infinito al feed de publicaciones en WordPress

El plugin tiene que realizar una consulta SQL a la base de datos para extraer el tipo correcto de publicación / artículo para mostrar al lector. Estas opciones le permiten configurar esa consulta a través de la interfaz gráfica.

  • Hacer clic los Mensajes para py tab.
  • Cambio los valor para 4.

Cómo agregar desplazamiento infinito al feed de publicaciones en WordPress

También existe la opción de agregar campos personalizados a la consulta, o agregar un término de búsqueda, de modo que solo se incluyan en la consulta las publicaciones que contengan un término de búsqueda en particular.

Cómo agregar desplazamiento infinito al feed de publicaciones en WordPress

Con la opción Parámetros de publicación, puede orientar publicaciones específicas, incluirlas en la consulta o excluirlas de ella. Como puede ver, es altamente configurable.

Siéntase libre de explorar estas opciones y ajustar los valores a su gusto para ver qué sucede.

El área de integraciones de la pantalla se refiere a los plugins pagados del plugin. Échales un vistazo para ver si necesitas alguna de estas funciones y considera comprar la versión pro del plugin.

  • Hacer clic el botón azul a la derecha para copiar el shortcode.
  • Hacer clic Ctrl + C.
  • Hacer clic Okay

Paso 3: ingrese el código corto

  • Hacer clic Mensajes > Agregar nuevo.
  • iniciar sesión en un título y una descripción apropiados.
  • insertar una bloque de código corto con el editor haciendo clic en el símbolo «+» o escribiendo «/».

Cómo agregar desplazamiento infinito al feed de publicaciones en WordPress

  • Sitio el shortcode.
  • Hacer clic Publicar dos veces.
  • Hacer clic Ver publicacion.

Ahora se le presentará una lista específica de publicaciones. El efecto Ajax se detendrá después de enviar la publicación nº30.


Paso nº4. – La configuración global

Puede cambiar la configuración global si desea tener un cargador predeterminado (preconfigurado).

  • Hacer clic Ajax Cargar más > ajustes.

Cómo agregar desplazamiento infinito al feed de publicaciones en WordPress

Cambia las opciones a tu gusto y guárdalas. La próxima vez, solo necesita ingresar el código corto [ajax_load_more] en sus publicaciones y se mostrará el cargador predeterminado.

Espero que hayas disfrutado de este tutorial, ¡gracias por leer!



.

No te olvides compartir en en tu Twitter y Facebook para que tus colegas opinen

👇👇👇 😘 💪 👇👇👇

Comparte