Conclusiones clave
- Elementor no tiene un widget de hoja de ruta, por lo que una hoja de ruta de Elementor generalmente se crea con un widget de línea de tiempo, donde cada elemento es una característica o fase.
- El widget Master Addons Timeline permite que cada elemento muestre una etiqueta personalizada en lugar de una fecha, lo que se adapta a los estados de la hoja de ruta, como Enviado, En curso, Siguiente y Explorando.
- Una hoja de ruta de un producto público funciona mejor con etiquetas de estado o trimestres, porque las fechas exactas de una hoja de ruta se convierten en promesas que los clientes recuerdan.
- El widget Timeline puede mostrar una hoja de ruta verticalmente con alineación izquierda, central, superpuesta o derecha, o como un carrusel horizontal con flechas.
- El estado enfocado en la pestaña Estilo del widget de línea de tiempo le da al elemento que un visitante ha desplazado hasta el fondo de su propia tarjeta y el color del punto.
Una página de hoja de ruta de Elementor muestra a los clientes lo que ha enviado, lo que está construyendo y lo que viene después. elemento no incluye un widget de hoja de ruta, pero una hoja de ruta es una línea de tiempo con estados en lugar de fechas, por lo que un widget de línea de tiempo hace el trabajo. Esta guía utiliza el Widget de línea de tiempo de complementos maestros.
El ejemplo es una hoja de ruta de software de cuatro elementos: Enviado, En progreso, Siguiente y Explorando. La misma construcción funciona para un plan de curso, un cronograma de construcción o un proceso de incorporación. Configurarás los elementos, cambiarás fechas por etiquetas, elegirás un diseño y diseñarás las fases.
Tabla de contenidos
Qué sucede en la página de la hoja de ruta de un producto
Una página de hoja de ruta del producto enumera el trabajo planificado en orden de qué tan cerca está de publicarse. Cada entrada necesita tres cosas: un estado, un nombre corto y una oración sobre lo que obtiene el cliente.
La mayoría de las hojas de ruta públicas utilizan uno de dos sistemas para el estado:
| Sistema | Etiquetas de ejemplo | Úselo cuando |
|---|---|---|
| Etiquetas de estado | Enviado, En progreso, A continuación, Explorando | No quieres comprometerte con las fechas |
| Cubos de tiempo | Primer trimestre de 2027, segundo trimestre de 2027, posterior | Planifica en cuartos y puede respaldarlos |
| Fechas exactas | 14 martie 2027 | La fecha es fija, como un evento o un lanzamiento |
Las etiquetas de estado son la opción más segura para el software. Una fecha deslizada en una página pública se captura de pantalla y una etiqueta como “Siguiente” no puede deslizarse.
Cómo construir la hoja de ruta en Elementor
Necesita complementos Elementor y Master. La hoja de ruta en sí es un widget de línea de tiempo configurado en Línea de tiempo personalizada.
Paso 1: Planifica las fases
Escribe la lista antes de abrir el editor. De cuatro a ocho elementos es suficiente. Para este ejemplo:
| Etiqueta | Característica | Descripción unifilar |
|---|---|---|
| Enviado | Rediseño de cheques | Pago de una página con carritos guardados. |
| En progreso | Espacios de trabajo en equipo | Proyectos, roles y comentarios compartidos. |
| Siguiente | Aplicación móvil | Aplicaciones de iOS y Android con modo sin conexión. |
| Explorando | Api pública | Webhooks y una API REST para integraciones. |
Paso 2: agregue el widget de línea de tiempo
Edite su página de hoja de ruta con Elementor, busque en el panel de widgets Cronograma y arrástrelo a la página. Mantener Tipo de línea de tiempo en Cronograma personalizado. El widget comienza con tres elementos de muestra. Usar Agregar artículo para un cuarto, o el icono duplicado en una fila para copiar uno.
¿Nuevo en el widget? Cómo crear una línea de tiempo en Elementor atraviesa todos los controles.
Paso 3: reemplace las fechas con etiquetas personalizadas
Abre el primer elemento. Cambiar Mostrar de la fecha a Etiqueta personalizada, luego escriba el estado en el Etiqueta campo. En el editor de contenido, haga de la primera línea un encabezado con el nombre de la función y escriba la descripción debajo.
Repita para cada elemento. El opcional Enlace field hace que se pueda hacer clic en una tarjeta completa, lo cual es útil para enviar una función enviada a su publicación de lanzamiento o a sus documentos.
Paso 4: elige un diseño
El diseño central de arriba alterna las cartas de izquierda a derecha. Otros dos diseños se adaptan bien a una hoja de ruta.
Alineado a la izquierda. En la pestaña Estilo, abrir Diseño y conjunto Alineación horizontal a la izquierda. Cada tarjeta se encuentra en un lado con su etiqueta dentro. Esto se lee como una lista, que es más fácil de escanear cuando las descripciones se prolongan.
Horizontal. En la pestaña Contenido, establezca Estilo de línea de tiempo a la línea de tiempo horizontal. Las fases se convierten en un carrusel con las etiquetas encima de la línea. Esto requiere una fila, por lo que cabe en una página de inicio o debajo de una tabla de precios.
Los ajustes del carrusel están cubiertos en cómo crear una línea de tiempo horizontal en Elementor.
Paso 5: diseña las fases
Abra la pestaña Estilo y trabaje en cuatro secciones.
- Tarjetas: relleno, radio de borde y colores de título y contenido. La pestaña Enfocado estiliza la tarjeta a la que se ha desplazado el visitante.
- Fechas: tipografía y color de las etiquetas de estado. Negrita con un color de marca hace que se lean como etiquetas.
- Línea: el fondo es la pista completa y el color de progreso se completa a medida que el visitante se desplaza.
- Puntos: un punto, un icono o una imagen, con colores predeterminados, flotantes y enfocados separados.
Cada elemento también tiene su propia pestaña Estilo en el panel Contenido, solo para configuraciones de puntos y colores en ese elemento. Úselo para darle al artículo enviado un color de punto diferente al resto, de modo que el trabajo terminado sea visible de un vistazo.
¿quieres ver más diseños primero? El Widget de línea de tiempo de Elementor page tiene demostraciones en vivo, incluida una hoja de ruta horizontal.
Qué poner en torno a la hoja de ruta
Una página de hoja de ruta se lee mejor con un poco de contexto encima y debajo de la línea de tiempo.
- Una breve introducción eso dice con qué frecuencia se actualiza la página.
- Un enlace de comentarios en la línea de tiempo, a un formulario o tablero de solicitud de funciones.
- Un registro de cambios por lo que ya se envió. El Widget de registros de cambios enumera las entradas de versiones en la misma página.
- Números, si los tienes. Una fila de Contrarrestar los widgets pueden mostrar funciones enviadas este año.
- Un indicador de progreso para un gran proyecto, usando el Widget de bar de progres.
Si la hoja de ruta es sólo para clientes, el guía de condiciones de visualización muestra cómo ocultar una sección a los visitantes desconectados.
Preguntas frecuentes
¿elementor tiene un widget de hoja de ruta?
No. Elementor y Elementor Pro no tienen hoja de ruta ni widget de línea de tiempo. La mayoría de las hojas de ruta de Elementor se crean con un widget de línea de tiempo a partir de un complemento, y cada elemento se utiliza como una fase o característica.
¿puedo mostrar una hoja de ruta sin fechas en Elementor?
Sí. En el widget Línea de tiempo de complementos maestros, configure Mostrar en etiqueta personalizada en cada elemento y escriba un estado como Enviado o Siguiente. La etiqueta reemplaza la fecha al lado del punto.
¿Debería una hoja de ruta pública ser vertical u horizontal?
Utilice vertical cuando cada fase tenga algunas líneas de descripción y horizontal cuando la hoja de ruta sea una franja corta de tres a seis fases dentro de otra página. El widget de línea de tiempo cambia entre ellos con el control Estilo de línea de tiempo.
¿Cómo marco un elemento de la hoja de ruta como está hecho?
Cambie su etiqueta a Enviado y dale un color de punto diferente en la pestaña Estilo del artículo. También puede agregar un enlace a la publicación de lanzamiento para que los visitantes puedan leer lo que cambió.
Pensamientos finales
Una hoja de ruta de Elementor es un widget de línea de tiempo con de cuatro a ocho elementos de línea de tiempo personalizados, Mostrar establecido en Etiqueta personalizada y un estado en cada campo de Etiqueta. Elija las secciones central, izquierda u horizontal para el diseño, luego use las secciones Tarjetas, Fechas, Línea y Puntos para diferenciar el trabajo enviado del trabajo planificado.
Comience desde una demostración en el Página del widget de la línea de tiempo y reemplaza los elementos de muestra con tus propias fases.
Lectura relacionada
