Personalización de la interfaz
Adapta la búsqueda a tu tienda
Ajustes del Back Office
Configura la búsqueda sin código
Empieza por los diseños y controles del Back Office. Adapta la interfaz sin editar plantillas ni reconstruir la configuración de búsqueda.
- Elige el diseño del widget y de la página de resultados.
- Muestra u oculta sugerencias, categorías, productos y resumen de facetas.
- Controla la visibilidad de marca, precios, insignias y CTA en las tarjetas de producto.
- Sustituye las etiquetas de botones compatibles y el texto de ayuda sin resultados.
- Reordena las secciones y campos permitidos cuando el diseño lo admita.
Personalización de tarjetas de producto
Elige una tarjeta de producto o crea la tuya
Empieza por una plantilla estándar u horizontal. Para un control completo, usa HTML personalizado con tus datos, estilos e interacciones compatibles.
Plantillas de tarjeta incluidas
Elige una tarjeta estándar u horizontal según el contexto de la tienda.
Control de los campos visibles
Muestra, oculta y ordena los campos permitidos: marca, precio, precio original, insignias y botones de acción.
Plantilla HTML avanzada
Crea una tarjeta de producto personalizada con una plantilla HTML segura compatible con Mustache y los campos de datos documentados.
Campos y acciones adicionales
Usa zonas definidas para campos adicionales y marcadores data-kea-action para las interacciones compatibles.
Interfaz para desarrolladores
Una API de personalización documentada
Las agencias pueden diseñar e integrar la búsqueda mediante una API, clases CSS y puntos de extensión documentados, sin depender de la implementación interna de los componentes.
Clases públicas kea-*
Estilos semánticos
Las clases documentadas cubren búsqueda, resultados, tarjetas de producto, filtros y sus elementos semánticos.
Variables de tema --kea-*
Controles del tema
Las variables controlan colores, tipografía, espacios, bordes, cuadrículas y proporciones del diseño.
Marcadores data-kea-*
Estados e interacciones
Modos, vistas, pantallas, puntos de ruptura, roles y acciones compatibles se exponen mediante marcadores documentados.
Las clases generadas por el framework son detalles de implementación. Las clases, variables, marcadores y eventos documentados forman la interfaz pública estable.
Modo Vista previa
Revisa los cambios antes de publicarlos
Cambia el diseño, las tarjetas de producto y los estilos en el Back Office, y prueba la tienda sin modificar lo que el cliente ve actualmente.
- Compara la tienda actual con la vista previa que estás editando.
- Revisa sugerencias, resultados, filtros, tarjetas de producto y diseños adaptables.
- Corrige avisos de integración o plantilla antes de activar.
- Aplica o descarta los cambios cuando la nueva experiencia esté lista.
Ajustes de la interfaz
Descubre los controles de personalización de la tienda
Elige un diseño, edita los campos compatibles de la tarjeta de producto, personaliza plantillas y compara las vistas previas de escritorio y móvil.
Edita junto a la vista previa de la tienda
Configura secciones, detalles de producto, diseño y comportamiento mientras el resultado de la tienda sigue visible.
Personaliza el HTML de la tarjeta de producto
Usa campos de producto documentados y validación inmediata cuando las plantillas incluidas no sean suficientes.
Previsualiza el desplegable de escritorio
Revisa productos, categorías, sugerencias, filtros y diseño en el desplegable de búsqueda antes de publicar.
Previsualiza la página de resultados de escritorio
Configura conjuntamente la cuadrícula de productos, los filtros, la paginación, los campos de la tarjeta de producto y el diseño de la página de resultados.
Revisa la página de resultados en móvil
Revisa la cuadrícula de productos, los filtros, la ordenación y los controles de las tarjetas de producto en la vista previa del teléfono.
Elige un diseño de búsqueda
Usa un widget de búsqueda, una página de resultados clásica o una experiencia combinada de widget y página de resultados.