Saltar al contenido principal
El elemento Acordeón sirve para organizar información en secciones expandibles y colapsables, permitiendo que los usuarios vean solo el contenido que desean, manteniendo la interfaz limpia y organizada. Para qué sirve
  • Organizar información en secciones colapsables para ahorrar espacio.
  • Crear FAQs (Preguntas Frecuentes) interactivas.
  • Presentar contenido detallado de forma organizada y accesible.
  • Mejorar la experiencia del usuario con navegación intuitiva.
  • Reducir la sobrecarga visual manteniendo información importante accesible.
Qué puedes configurar Modo de Apertura:
  • Único: Solo un elemento puede estar abierto a la vez (comportamiento por defecto).
  • Múltiple: Varios elementos pueden estar abiertos simultáneamente.
Contenido de los Elementos:
  • Título: Texto principal de cada sección con formato enriquecido (negrita, cursiva, colores, etc.).
  • Descripción: Contenido detallado de cada sección con editor completo de texto.
  • Variables: Inserta variables dinámicas tanto en el título como en la descripción.
Configuraciones de Contenido:
  • Mínimo: 1 elemento obligatorio.
  • Máximo: 10 elementos por acordeón.
  • Formato: Editor completo con barra de herramientas para formato avanzado.
Estilos Visuales:
  • Borde: Color de las líneas separadoras entre elementos.
  • Título: Color personalizado para el texto del título de cada elemento.
  • Descripción: Color personalizado para el contenido de la descripción.
  • Icono: Color del icono de expansión/colapso.
Animaciones:
  • Transición: Animación suave al abrir y cerrar los elementos.
  • Icono: Rotación del icono indicando el estado (abierto/cerrado).
Interactividad:
  • Hover: Efecto de subrayado al pasar el mouse sobre el título.
  • Clic: Expansión/colapso del contenido al hacer clic en el título.
¡Consejo de uso! Usa acordeones para organizar información compleja de forma clara y accesible. Mantén los títulos concisos y descriptivos, y organiza el contenido de forma lógica. Evita crear demasiados elementos (máximo 5-7) para no sobrecargar al usuario. Usa el modo “Único” para FAQs y el modo “Múltiple” cuando el usuario necesita comparar información entre diferentes secciones.