# AX - Cronología ## Descripción general **AX - Cronograma** es un componente de Experience Cloud que muestra registros de Salesforce en orden cronológico en las páginas de Experience Sites. Úsalo para mostrar a los usuarios del portal actividades basadas en fechas, como su historial de casos, cronograma de pedidos, hitos del proyecto o cualquier registro con fecha. Los usuarios pueden buscar y filtrar entradas, hacer clic en elementos para navegar a los registros y ver eventos organizados por períodos de tiempo. Obtén datos de cualquier objeto estándar o personalizado con campos de fecha. Perfecto para feeds de actividad, historiales de casos, cronogramas de seguimiento de pedidos, actualizaciones del estado de proyectos o cualquier lugar donde los usuarios del portal necesiten ver "qué ocurrió y cuándo" en un formato desplazable y cronológico. {% hint style="success" %} El Cronograma Avonni es [Listo para Reactividad](/experience-cloud/experience-cloud-es/primeros-pasos/componentes-reactivos.md) {% endhint %} ## Propiedades {% tabs %} {% tab title="Configuración básica" %} | Nombre | Descripción | | --------------------------------- | --------------------------------------------------------------------- | | **Título** | El encabezado principal del cronograma. | | **Texto de estilo del título** | Personaliza el estilo de fuente del título para darle énfasis visual. | | **Subtítulo** | Una breve descripción o texto complementario para el cronograma. | | **Texto de estilo del subtítulo** | Ajusta el estilo de fuente del subtítulo para complementar el título. | | {% endtab %} | | {% tab title="Elementos visuales y funcionales" %} | Nombre | Descripción | | --------------------------------- | --------------------------------------------------------------------------------------------------------------- | | **Nombre del icono** | Elige un icono del Salesforce Lightning Design System para representar los elementos del cronograma. | | **Tamaño del icono** | Determina el tamaño del icono para mantener la coherencia visual. | | **Orientación** | Selecciona entre los diseños 'vertical' y 'horizontal' según el contenido y las necesidades de espacio. | | **Dirección de ordenación** | Elige 'asc' para orden ascendente o 'desc' para orden cronológico descendente. | | **Agrupar por** | Organiza los elementos del cronograma por 'semana', 'mes' o 'año' para facilitar la navegación y la comprensión | | **Formato de fecha del elemento** | Formatea la visualización de las fechas en los elementos del cronograma para lograr claridad y coherencia | | **Está unido** | Elige si los elementos del cronograma están visualmente conectados por una línea o un trayecto | | **Cerrado** | Activa o desactiva si el cronograma está cerrado o abierto | | **Plegable** | Permite que las secciones del cronograma sean plegables, mejorando la interacción del usuario | | **Se puede buscar** | Permite a los usuarios buscar dentro del cronograma elementos o eventos específicos | | **Mostrar paginación** | Implementa paginación para cronogramas con una gran cantidad de elementos | | **Máximo de elementos visibles** | Establece el número máximo de elementos que se mostrarán antes de que entre en acción la paginación | | {% endtab %} | | {% tab title="Interactividad y personalización" %} | Nombre | Descripción | | ---------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------- | | **Acciones del encabezado** | Añade botones de acción en el encabezado del cronograma para comandos e interacciones del usuario. | | **Acciones de los elementos** | Implementa botones de acción a nivel de elemento para funcionalidades específicas. | | **Atributos de campo** | Configura la visualización de los campos dentro de los elementos del cronograma, incluido el número de columnas y las variantes para la presentación de campos | | **Opciones de filtrado** | Incluye un mecanismo de filtrado mostrado como un popover para ordenar o reducir los elementos del cronograma | | **Opciones del motor de búsqueda** | Personaliza la funcionalidad de búsqueda con texto de marcador de posición y ajustes de posición | | **Opciones de paginación** | Ajusta la alineación y personaliza las etiquetas e iconos de los controles de paginación de 'primero', 'último' y 'siguiente' | | {% endtab %} | | {% tab title="Fuente de datos" %} | Nombre | Descripción | | ------------------- | ----------------------------------------------------------------------------------------------------- | | **Manual** | Introduce manualmente los elementos del cronograma y sus detalles. | | **Fuente de datos** | Usa una consulta para rellenar automáticamente el cronograma con elementos desde una fuente de datos. | | {% endtab %} | | | {% endtabs %} | | ## Configuración de estilo {% tabs %} {% tab title="Encabezado" %} | Nombre | Descripción | | ---------------------------------------------------- | ----------------------------------------------------------------------------------------- | | **Color de fondo** | Establece el color de fondo del encabezado. | | **Color del borde** | Determina el color del borde del encabezado. | | **Tamaño del borde** | Ajusta el grosor del borde alrededor del encabezado. | | **Estilo del borde** | Selecciona el estilo del borde (por ejemplo, sólido, discontinuo, punteado). | | **Radio del borde** | Redondea las esquinas del encabezado para darle un aspecto más suave. | | **Color del borde inferior (Está unido)** | Si los elementos del cronograma están unidos, esto establece el color del borde inferior. | | **Tamaño del borde inferior (Está unido)** | Ajusta el grosor del borde inferior cuando los elementos están unidos. | | **Estilo del borde inferior (Está unido)** | Elige el estilo del borde inferior para los elementos unidos. | | **Relleno (Superior, Derecho, Inferior, Izquierdo)** | Establece el espaciado interno dentro del encabezado. | | **Margen inferior** | Determina el espacio debajo del encabezado. | | {% endtab %} | | {% tab title="Título del encabezado" %} | Nombre | Descripción | | -------------------- | ----------------------------------------------------------------- | | **Color** | Cambia el color del texto del título. | | **Tamaño de fuente** | Cambia el color del texto del título. | | **Peso de fuente** | Altera el grosor o la negrita del texto del título. | | **Estilo de fuente** | Aplica estilo (por ejemplo, cursiva, normal) al texto del título. | | {% endtab %} | | {% tab title="Subtítulo del encabezado" %} | Nombre | Descripción | | -------------------- | ------------------------------------------------------ | | **Color** | Establece el color del texto del subtítulo. | | **Tamaño de fuente** | Ajusta el tamaño del texto del subtítulo. | | **Peso de fuente** | Altera el grosor o la negrita del texto del subtítulo. | | **Estilo de fuente** | Aplica estilo al texto del subtítulo | | {% endtab %} | | {% tab title="Avatar del encabezado" %} | Nombre | Descripción | | -------------------- | ----------------------------------------------------------------------- | | **Color** | Establece el color de fondo del avatar. | | **Tamaño de fuente** | Cambia el color del contenido del avatar (por ejemplo, icono o imagen). | | **Peso de fuente** | Ajusta el color de utilidad para dar contraste o énfasis | | **Estilo de fuente** | Redondea las esquinas del avatar para darle una apariencia más suave. | | {% endtab %} | | {% tab title="Botones de paginación" %} | Nombre | Descripción | | -------------------------- | ------------------------------------------------------------------------------ | | **Borde** | Establece las propiedades del borde de los botones de paginación. | | **Fondo** | Cambia el color de fondo de los botones. | | **Color del texto/icono** | Ajusta el color del texto o de los iconos dentro de los botones. | | **Color del botón activo** | Especifica el color del botón de paginación cuando está activo o seleccionado. | | {% endtab %} | | | {% endtabs %} | | --- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://docs.avonnicomponents.com/experience-cloud/experience-cloud-es/experience-components/ax-cronologia.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.