Atributos del script

Toda la configuración se pasa mediante atributos data-* en la etiqueta <script>. El snippet de abajo es un ejemplo mínimo —la lista completa de atributos disponibles está documentada en las secciones siguientes.

<script
  src="https://search.solosearch.app/widget.js"
  data-engine="your-engine-uuid"
  data-input="#search"
  defer
></script>

Obligatorios

data-engine

El UUID del motor de búsqueda que se usará. El snippet generado por el panel ya incluye este valor. También puedes encontrarlo manualmente en Search → Search Engines → [tu motor] → General.

data-engine="c4b119f6-321e-4268-9d98-8d030f6dfb1a"

El widget no se inicializará si este atributo falta o está vacío.

Campo de búsqueda

data-input

Un selector CSS para el campo de tu página que activa la búsqueda. Por defecto #search si se omite. Lo que hace exactamente depende de si el template set activo es anclado o superpuesto (ver Conceptos básicos):

  • Template sets anclados — este elemento es el campo de búsqueda. El widget se asocia a él directamente y posiciona los resultados en línea debajo.
  • Template sets superpuestos — este elemento es solo el disparador. Enfocarlo o hacer clic en él abre la superposición, que tiene su propio campo de búsqueda integrado en la plantilla.
data-input="#search"

data-input=".header-search input"

data-input="input[name=q]"

Este elemento debe existir en tu página —el widget nunca crea su propio disparador.

Apariencia

data-locale

Sobrescribe el idioma usado para los textos de la interfaz del widget (p. ej. "Sin resultados", "Ver más", texto del placeholder). Valores admitidos: en, es, fr, de, it.

data-locale="es"

Si se omite, el widget usa el idioma configurado en el motor en el panel (General → Language), que por defecto es inglés.

data-template

Fuerza un template set concreto para esta instancia del widget, por encima del que esté marcado como activo para el motor en Design → Template Sets. Recibe el UUID de un template set, que se muestra en su propia página de edición (Design → Template Sets → [set] → UUID).

data-template="a1b2c3d4-1234-5678-9abc-def012345678"

Útil si estás embebiendo más de un widget en la misma página y quieres que se vean distintos —cada etiqueta <script> puede llevar su propio data-template. La mayoría de tiendas no lo necesitan; es más sencillo simplemente marcar el template set deseado como el activo del motor en el panel.

Avanzado

data-api

Sobrescribe el servidor de API con el que habla el widget. Rara vez hace falta: por defecto el widget lo deriva automáticamente de la URL del propio widget.js, así que se mantiene correcto aunque esa URL cambie entre entornos.

data-api="https://search.solosearch.app"

Solo indícalo explícitamente si quieres apuntar el widget deliberadamente a un backend distinto del que sirve widget.js —por ejemplo, para probar contra un entorno de staging.

💡 El mínimo de caracteres para buscar, los resultados por página, el límite de valores de faceta y el debounce de tecleo se configuran en el panel bajo Design → General → Search Behavior, no como atributos del script —consulta Plantillas y opciones de diseño.