Plantillas y opciones de diseño
Ve a Search → Search Engines → [tu motor] → Design.
Esta sección controla la apariencia visual de tu widget: qué template set está activo, el idioma de la interfaz, el esquema de colores y una serie de opciones de visualización. Está repartida en dos pestañas, General y Template Sets.
Plantillas
En General → Active Template Set, elige qué template set está activo ahora mismo para este motor de búsqueda. El cambio se aplica automáticamente —no se requiere Reindexación del feed.
SoloSearch incluye de serie 6 template sets listos para usar: un estilo anclado, donde los resultados aparecen en línea bajo el campo de búsqueda, y dos estilos superpuestos, un panel centrado y una toma de pantalla completa —cada uno disponible en Light y Dark. Puedes verlos todos —además de algunos totalmente personalizados creados para tiendas reales— en la página de Demos.
Los template sets son totalmente personalizables. En la pestaña Template Sets, duplica cualquiera de los integrados para obtener tu propia copia editable, o crea uno desde cero. Consulta Temas y variables CSS para cambiar los colores sin tocar ninguna plantilla.
Idioma
La configuración de idioma controla los textos de la interfaz dentro del widget —etiquetas, marcadores de posición, mensajes como "Sin resultados" y cualquier otro texto que forme parte de la interfaz del widget (no el contenido de los productos).
Los idiomas disponibles dependen de las traducciones incluidas en el widget. Selecciona en el desplegable el idioma que corresponde al idioma de tu tienda. Si tu idioma no está disponible, contacta con el soporte.
Colores
Puedes configurar el color principal del widget para que coincida con tu marca. Esto afecta a los elementos interactivos como botones, destacados, valores de filtro seleccionados y anillos de enfoque.
El selector de color te permite establecer un valor hexadecimal personalizado. Los cambios se aplican automáticamente en aproximadamente un minuto.
Para un control más granular sobre elementos individuales de la interfaz, consulta Temas y variables CSS.
Opciones de visualización
Cada una se puede activar o desactivar de forma independiente, sin editar ninguna plantilla —ese es el sentido de las opciones de diseño: cubrir los casos comunes para que la mayoría de tiendas nunca necesite tocar el HTML de una plantilla.
Tarjeta de producto
| Opción | Qué muestra |
|---|---|
| Show brand | Muestra el nombre de la marca del producto en la tarjeta de resultado. |
| Show discount badge | Calcula y muestra automáticamente una insignia de porcentaje de descuento cuando un producto tiene price y sale_price, y el precio de oferta es menor. No requiere configuración manual —la insignia aparece y se actualiza basándose en los datos del feed. |
| Show Add to Cart button | Muestra un botón "Añadir al carrito" en cada tarjeta de resultado. Requiere una pequeña integración en la tienda para conectar el botón con tu carrito —consulta Botón Añadir al carrito para los detalles de implementación. Si un producto no se puede añadir al carrito directamente (por ejemplo, un producto configurable o un bundle), la tarjeta muestra en su lugar un enlace "Ver producto". |
| Show price | Muestra el precio del producto en la tarjeta de resultado. Desactívalo si manejas un catálogo de "precio a consultar". |
| Show product image | Muestra la miniatura del producto en la tarjeta de resultado. |
| Open products in a new tab | Los enlaces de producto se abren en una nueva pestaña en lugar de navegar fuera de los resultados de búsqueda. |
Panel de búsqueda
| Opción | Qué muestra |
|---|---|
| Show recent searches | Una fila de badges sobre los resultados, que permite repetir una búsqueda reciente propia. |
| Show voice search button | Un botón de micrófono junto al campo de búsqueda, para navegadores que soportan entrada por voz. |
| Show results count | La línea "N resultados" sobre la rejilla de resultados. |
| Show popular searches | La fila de búsquedas más populares de tu tienda, mostrada junto a los filtros, cuando hay datos para ello. |
Todas las opciones se aplican independientemente del template set activo. Los cambios surten efecto automáticamente en aproximadamente un minuto.
Comportamiento de búsqueda
Debajo de las opciones de visualización, una sección Search Behavior permite ajustar cómo busca el widget —de nuevo, sin tocar el código embebido en tu sitio:
| Opción | Qué hace |
|---|---|
| Minimum characters to search | Cuántos caracteres debe escribir el usuario antes de enviar una petición de búsqueda. Por defecto 2. |
| Max results per page | Cuántos resultados se cargan por página; la siguiente página se carga automáticamente al hacer scroll (scroll infinito). Por defecto 30. |
| Facet values shown before "Show more" | Cuántos valores aparecen por filtro antes de que se muestre un botón "Ver más". Por defecto 8. |
| Typing debounce (ms) | Cuánto espera el widget tras la última pulsación antes de enviar la búsqueda. Por defecto 100. |