Cómo mostrar publicaciones de blog en una línea de tiempo en Elementor

Publicaciones de blog mostradas como tarjetas a lo largo de una línea de tiempo vertical

Conclusiones clave

  • Una línea de tiempo de publicación de Elementor coloca las publicaciones de blog publicadas a lo largo de una línea vertical en orden de fecha y se actualiza por sí sola cada vez que se publica una nueva publicación.
  • Elementor y Elementor Pro no tienen widget de línea de tiempo, por lo que una línea de tiempo posterior necesita un complemento o una plantilla de bucle personalizada diseñada con CSS.
  • El tipo Post Timeline en el widget Master Addons Timeline es parte de Master Addons Pro y se selecciona con el control Timeline Type en la pestaña Contenido.
  • La consulta Línea de tiempo de publicaciones tiene publicaciones por página, pedido de publicaciones, pedido por con nueve opciones, categoría, filtro por etiqueta, autor, publicaciones para excluir y recuento de publicaciones compensadas.
  • Cada tarjeta Post Timeline puede mostrar el título de la publicación, la imagen destacada, un extracto con una longitud establecida y un botón Leer más, y Habilitar enlaces hace que se pueda hacer clic en toda la tarjeta.
  • Las líneas de tiempo de publicación en el widget Master Addons son solo verticales, mientras que el diseño del carrusel horizontal está reservado para elementos de línea de tiempo personalizados escritos a mano.

Una línea de tiempo de publicación de Elementor convierte el archivo de su blog en una línea fechada: la publicación más reciente en la parte superior, cada una con una tarjeta con su título, imagen y extracto. elemento no tiene ningún widget para esto, por lo que los pasos a continuación utilizan el tipo de línea de tiempo posterior Widget de línea de tiempo de complementos maestros, que es una función profesional.

Esta guía cubre la configuración de la consulta, los filtros, lo que muestra cada tarjeta y cómo diseñarla. También cubre cuando una cuadrícula del Widget de blog le serviría mejor que una línea de tiempo.

Qué es una línea de tiempo posterior y cuándo usarla

Una línea de tiempo de publicación es una línea de tiempo dinámica cuyas entradas provienen de sus publicaciones de WordPress en lugar de elementos que escribe a mano. Publica una publicación y aparece en la línea. Nadie tiene que editar la página.

Eso lo convierte en una buena opción para el contenido donde la fecha es el punto:

  • Noticias y comunicados de prensa de la empresa
  • Notas de la versión, donde cada publicación es una versión
  • Un diario de proyecto o un registro de construcción
  • Resumen del evento a lo largo de una temporada

Es una opción más débil para un índice de blog ordinario. Los lectores buscan temas y una cuadrícula muestra más publicaciones por pantalla.

Cómo crear una línea de tiempo posterior en Elementor

Necesita Elementor, Master Addons Pro y al menos algunas publicaciones publicadas con imágenes destacadas. Luego se necesitan cinco pasos.

Paso 1: establezca el tipo de línea de tiempo en Publicar línea de tiempo

Edite la página con Elementor, busque en el panel de widgets Cronograma y arrástrelo hacia adentro. En la pestaña Contenido, abra el Cronograma sección y cambio Tipo de línea de tiempo desde la línea de tiempo personalizada hasta Post cronología. Los elementos de muestra desaparecen y sus últimas publicaciones ocupan su lugar.

Widget Elementor Timeline con tipo de línea de tiempo configurado en línea de tiempo de publicación, que muestra publicaciones de blog a lo largo de una línea vertical
Con la línea de tiempo de publicación seleccionada, el panel intercambia la lista de elementos por controles de publicación, miniatura, fecha y consulta.

El menú desplegable Estilo de línea de tiempo desapareció en este punto. Una línea de tiempo posterior siempre es vertical.

Paso 2: establezca la consulta

Desplácese hacia abajo en la misma sección hasta los controles de consulta. Estos deciden qué publicaciones se cargan y en qué orden.

ControlLo que hace
Publicaciones por páginaCuántas publicaciones muestra la línea de tiempo
Orden postalDescendiente (el más nuevo primero) o Ascendente
Ordenar porNinguno, ID, Autor, Título, Nombre, Fecha, Última Modificación, Aleatorio o Número de Comentarios
Recuento de publicaciones compensadasSe salta tantas publicaciones desde el inicio de la lista
¿ignorar Sticky?Evita que los postes pegajosos salten a la cima

Para obtener una línea de tiempo, deje Order By en Fecha. El orden aleatorio o de título rompe lo único que promete una línea de tiempo, que es el orden en el tiempo. Utilice Ascending cuando la historia debe leerse desde el principio, como un diario de proyecto.

El recuento de publicaciones compensadas es útil cuando una publicación destacada ya se encuentra encima de la línea de tiempo. Configure en 1 y la línea de tiempo comenzará desde la segunda publicación.

Paso 3: Filtrar por categoría, etiqueta o autor

Debajo de la configuración del pedido hay cuatro filtros: Categoría, Filtrar por etiqueta, Autor y Publicaciones para excluir.

Controles de consulta de línea de tiempo de publicaciones en Elementor: publicaciones por página, orden de publicaciones, orden por, categoría, filtro por etiqueta, autor y publicaciones para excluir
Los controles de consulta y filtro. Deje los filtros vacíos para cargar publicaciones de todo el blog.

Un filtro de categoría es la forma habitual de crear una línea de tiempo enfocada. Coloque las publicaciones de la versión en una categoría de “Lanzamientos”, selecciónela aquí y el widget se convertirá en un registro de cambios que se escribe solo. Publicaciones para excluir elimina publicaciones individuales que no pertenecen, como un anuncio que no desea en la línea.

Paso 4: Elige lo que muestra cada tarjeta

La parte superior de la sección controla el contenido de la tarjeta.

  • Mostrar título, con Enlace de título y a Etiqueta de encabezado. H2 es el valor predeterminado. Elija un nivel inferior si la línea de tiempo se encuentra debajo de un H2 propio.
  • Mostrar imagen y Resolución de imagen para la imagen destacada.
  • Formato de fecha y Formato de tiempo para la fecha al lado de cada punto.
  • Longitud del extracto, Tipo de extracto y Leer más texto para el resumen y el botón.
  • Habilitar enlaces hace que toda la tarjeta se vincule a la publicación.

Active Habilitar enlaces o Enlace de título, no ambos. Un enlace dentro de una tarjeta vinculada no es HTML y el panel advierte sobre ello en el conmutador.

Paso 5: peina las publicaciones y las cartas

Vaya a la pestaña Estilo. El Publicaciones estilos de sección qué es específico de una línea de tiempo posterior: color del título, tipografía y espaciado del título, color del extracto y el botón Leer más con tipografía, relleno, radio del borde y colores normal y flotante.

Sección de publicaciones en la pestaña Estilo del widget Elementor Timeline con control de botón Color del título, Tipografía y Leer más
La sección Publicaciones. El botón Leer más tiene su propio relleno, radio y estado de desplazamiento.

El resto se comparte con cada línea de tiempo. Tarjetas establece relleno, radio de borde y fondo, con apariencia predeterminada, flotante y enfocada separadas. Línea establece la pista y el color de progreso que se llena a medida que el visitante se desplaza. Puntos y Fechas peina los marcadores y el texto de la fecha.

Sección de tarjetas en la pestaña Estilo del widget Elementor Timeline con una vista previa posterior a la línea de tiempo
La tarjeta enfocada, a la que se ha desplazado el visitante, puede tener su propio fondo para que destaque el puesto actual.

El tutorial principal de la línea de tiempo pasa por los tramos de Línea, Puntos y Fechas uno a uno.

¿necesita ambos tipos de líneas de tiempo? El Widget de línea de tiempo page compara Custom Timeline y Post Timeline una al lado de la otra, con demostraciones en vivo.

Línea de tiempo posterior versus línea de tiempo personalizada

Elija la línea de tiempo de publicación cuando las entradas ya existan como publicaciones y la línea de tiempo personalizada cuando desee escribir cada entrada usted mismo.

FactorPost cronologíaCronograma personalizado
El contenido proviene dePublicaciones publicadasElementos agregados en el panel
ActualizacionesCada vez que publicasCuando editas el widget
DiseñosverticalCarrusel vertical u horizontal
Cada entrada muestraTítulo, imagen destacada, fecha, extracto, Leer másFecha o etiqueta personalizada, contenido, imagen, enlace
planificarComplementos maestros ProComplementos maestros
Mejor paraNoticias, notas de la versión, diariosHistorial de la empresa, hojas de ruta, pasos del proceso

Si quieres el diseño del carrusel, mira cómo crear una línea de tiempo horizontal en Elementor.

Cronología o cuadrícula de blogs: ¿cuál?

Utilice una línea de tiempo cuando el orden importe más que la elección y una cuadrícula cuando los lectores estén navegando.

Si estás construyendoEmpezar con
Una página de noticias o prensaPost cronología
Notas de la versión de una categoríaPost Cronología con filtro de categoría
El índice principal del blogWidget de blog en cuadrícula o diseño de lista
Publicaciones relacionadas bajo un artículoWidget de blog en modo carrusel
Una plantilla de archivo de categorías o etiquetasWidget de blog con consulta actual

La ruta de la cuadrícula se cubre paso a paso cómo crear una página de blog con Elementor. También puede utilizar ambos: una línea de tiempo de tres publicaciones de noticias recientes en la página de inicio y la cuadrícula completa en la página del blog.

Preguntas frecuentes

¿elementor tiene un widget de línea de tiempo posterior?

No. Ni Elementor ni Elementor Pro envían un widget de línea de tiempo. Elementor Pro puede enumerar publicaciones con los widgets Posts o Loop Grid, pero convertirlas en una línea de tiempo con una línea y puntos requiere CSS personalizado. Un widget de línea de tiempo adicional lo hace desde la configuración.

¿es la línea de tiempo posterior en los complementos maestros una función profesional?

Sí. El tipo de línea de tiempo de publicación necesita Master Addons Pro. El tipo de línea de tiempo personalizada, donde agrega cada elemento a mano, no utiliza la consulta de publicación en absoluto.

¿puede una línea de tiempo de publicación mostrar publicaciones de una sola categoría?

Sí. Seleccione la categoría en el control de Categoría de la sección Línea de tiempo. Puede combinarlo con Filtrar por etiqueta y Autor, y eliminar publicaciones individuales con Publicaciones para excluir.

¿puedo hacer una línea de tiempo de publicación horizontal?

No en el widget Master Addons. Las líneas de tiempo de las publicaciones son verticales. Para publicaciones en una fila horizontal, use un carrusel de publicaciones o agregue las entradas a mano como elementos de línea de tiempo personalizados y cambie el estilo de la línea de tiempo a la línea de tiempo horizontal.

¿Se actualiza la línea de tiempo cuando publico una nueva publicación?

Sí. El widget consulta sus publicaciones cada vez que se carga la página, por lo que aparece una nueva publicación que coincide con los filtros sin editar la página. Si un complemento de caché está activo, la página se actualiza una vez que se borra su caché.

Pensamientos finales

Una línea de tiempo de publicación de Elementor necesita tres decisiones: qué publicaciones (Categoría, Etiqueta, Autor, Publicaciones para excluir), en qué orden (Publicación Orden y Orden por, generalmente Fecha) y qué muestra cada tarjeta (título, imagen, extracto, Leer más). El tipo Línea de tiempo de publicación maneja los tres desde la pestaña Contenido y permanece vertical.

Vea los diseños y demostraciones en el Widget de línea de tiempo de Elementor página, o consultar Precios de Master Addons Pro si solo necesitas la fuente de la publicación.

Imagen de Roy Jemee
Roy Jemee
Soy Roy Jemee, especialista en contenido y comercializador de Pixar Labs, y trabajo en complementos maestros para Elementor. Escribo los tutoriales, grabo los videos y mantengo la documentación actualizada, para que siempre sepas cómo usar cada función. También me encargo del soporte, así que si tienes algún problema, soy la persona que te ayuda a solucionarlo. Respuestas reales, de alguien que usa estas herramientas todos los días.

Deja una respuesta

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