Cómo añadir un deslizador de posts de WordPress gratis a tu sitio

En este artículo, vamos a explorar como hacer que los posts se deslicen en WordPress usando un plugin de deslizamiento. Vamos a usar uno de los mejores plugins de WordPress, el Carrusel de Mensajes Respuesta.

La mayoría de las veces, al crear tu sitio web, te gustaría tener un carrusel en tu sitio web que muestre las publicaciones filtradas por ciertos criterios. ¡De hecho, diría que es un artículo imprescindible! Una vez que hayas decidido que vas a construir un deslizador de posts básicos, la siguiente pregunta es cómo crear exactamente un carrusel de posts básicos en WordPress.

Si eres un desarrollador de WordPress o es tu hobby construir sitios usando WordPress, ya sabes que WordPress proporciona un montón de plugins para casi todas las características que se te ocurren, y puede ser difícil elegir cual usar. Para este post, he elegido uno de los mejores de la categoría, Responsive Posts Carousel, y te mostraré cómo usarlo a lo largo de este tutorial.

El plugin Responsive Posts Carousel permite mostrar publicaciones, páginas y otros tipos de contenido en un deslizador. Y como su nombre lo indica, este plugin soporta un diseño sensible, así que el deslizador que se construye usando este plugin se adaptará a todos los diferentes dispositivos. ¡Estoy seguro de que eres consciente de lo crítico que es esto hoy en día! Por lo tanto, es una característica imprescindible cuando eliges un plugin de terceros para construir deslizadores en tu sitio web.

A continuación, exploraremos los fundamentos del plugin Responsive Posts Carousel junto con el proceso de configuración. Luego, construiremos un ejemplo del mundo real que demostrará el uso del plugin Responsive Posts Carousel. Y por último, echaremos un vistazo a algunos parámetros importantes soportados por este plugin que le permiten personalizar un deslizador según sus necesidades.

¿Qué es el Responsive Posts Carousel?

Si buscas un plugin deslizante fácil de usar y con muchas funciones, el plugin Responsive Posts Carousel es uno de los mejores de la categoría. Te permite crear contenidos y deslizadores de imágenes muy fácilmente.

Echemos un vistazo a las características que proporciona:

• totalmente receptivo y adaptable a todo tipo de dispositivos
• escalas de acuerdo con el tamaño del contenedor
• configuraciones separadas para los dispositivos de escritorio, tabletas y móviles
• elección de más de 50 plantillas diferentes
• soporta tipos de postes personalizados y permite usar Advanced Custom Fields (ACF) para clasificar los postes
• soporta todos los navegadores populares
• muchas opciones de configuración para personalizar tu deslizador
• fácil de implementar

Para este artículo, he usado WordPress 5.0.3, y la versión del plugin Responsive Posts Carousel es la 5.0. Te recomendaría que lo instalaras si quieres seguir con este artículo. Puedes instalar el plugin, desde el repositorio gratuito de plugins de WordPress.com

¡A continuación, aprenderás a construir un deslizador de posts en tu sitio web de WordPress!

¿Cómo crear un deslizador de mensajes?

En esta sección, verás como configurar un deslizador de posts desde las páginas de administración de WordPress. Dirígete a tu pantalla de administración de WordPress.

Una vez que instales el plugin Responsive Posts Carousel, añadirá un enlace en la barra lateral izquierda como se muestra en la siguiente captura de pantalla.

Haz clic en el enlace Carousels > All Carousels, y debería llevarte a la página de listado de carousels como se muestra en la siguiente captura de pantalla.

Haz clic en el botón Add New (Agregar nuevo) para agregar un nuevo carousel y debería abrir un formulario que te permite crear un nuevo carousel.

Como puedes ver, hay seis pestañas diferentes y cada sección te permite configurar un aspecto diferente de tu deslizador. Vamos a repasar cada sección en detalle.

Pestaña de contenido

Echemos un vistazo a la pestaña de Content (contenido) que es la sección más importante al configurar el control deslizante.

La opción Display By (Mostrar por) permite filtrar los puestos por el tipo de puesto o por la taxonomía. Si selecciona By Post Type (Por tipo de post), se muestra el desplegable Seleccionar tipo de post que le permite Select Post Type (seleccionar el tipo de post). Por otro lado, si se selecciona By Taxonomy (Por taxonomía), se muestra el desplegable Select Term (Seleccionar término) que permite seleccionar un campo de taxonomía.

A continuación, si has seleccionado el tipo de post, te permite elegir los posts que quieres mostrar en el carousel. Por otro lado, si has seleccionado la taxonomía, te permite elegir los términos que se utilizarán para filtrar los mensajes.

Más adelante en la configuración, te proporciona el campo Exclude Posts (Excluir mensajes) que le permite seleccionar los mensajes que deseas excluir del carousel.

A continuación, está el campo desplegable Post Style (Estilo del post), que permite seleccionar el estilo del post para mostrarlo en el deslizador. Junto con eso, hay campos de Title and Content (Título y Contenido) que te permiten configurar los campos de encabezado y descripción de una diapositiva.

Por último, hay un par de opciones de uso como la Description Words Length (longitud de las palabras de descripción), Read More Button Text (el texto de los botones de lectura), Link Target (el objetivo de enlace) y la Disable Post Meta (desactivación de la meta del mensaje).

Pestaña deslizante

A continuación, la sección Slider (deslizante) permite configurar los aspectos de visualización de tu carousel.

En general, esta sección proporciona una configuración que permite configurar la velocidad, las columnas y ciertos ajustes relacionados con la accesibilidad.

Pestaña de colores

Como su nombre lo indica, la pestaña Colores le permite elegir los colores de fondo y de texto para los diferentes elementos de un carousel.

Pestaña de tipografía

La pestaña Typography (Tipografía) permite configurar la familia de fuentes y el tamaño de las mismas para los campos de título y descripción.

Arrows Tab (Pestaña de flechas)

La pestaña Arrows (Flechas) permite configurar diferentes aspectos de las flechas que se mostrarán para la navegación. También hay una opción que permite activar o desactivar las flechas por completo.

Configuración avanzada

Por último, la pestaña Advanced (Avanzado) permite configurar algunos ajustes varios.

Entre ellos, puedes usar los campos Rows (Filas) y Slider Per Row (Deslizador por Fila) para mostrar un deslizador en un modo de cuadrícula. También puedes seleccionar el tamaño de la miniatura que se utilizará mientras se muestran las imágenes.

Una vez que hayas terminado con todos los ajustes, haz clic en el botón Publish (Publicar) para publicar el carousel y volverás a la página de listado de carousels como se muestra en la siguiente captura de pantalla.

Como puedes ver, ya hay un atajo disponible para el carousel que acabas de crear. Puedes usar este atajo en un post o en la barra lateral donde quieras mostrar este carousel. Con configuraciones genéricas, debería verse algo así.

Así que así es como puedes construir un carousel de posts usando el plugin Responsive Posts Carousel. Siéntete libre de experimentar con diferentes opciones y hazme saber si tienes alguna pregunta al respecto.

Y con eso, hemos llegado al final de este artículo también. Me encantaría escucharte si quieres compartir tus experiencias sobre los otros plugins de carousel que has usado en tu página web.

Conclusión

Hoy hemos discutido como construir un carousel de posts usando el plugin Responsive Posts Carousel en WordPress. Hicimos un repaso en profundidad de este plugin y discutimos diferentes aspectos del mismo.

¡Siéntete libre de compartir tus pensamientos y opiniones usando el siguiente feed!