Searcher Banners

Banners promocionales que aparecen dentro del panel de búsqueda del sitio. Se componen de un título de sección y una lista de banners, cada uno con imagen, título y enlace. La visibilidad de cada banner se controla de forma independiente.

---

Vista previa

Sin imagen disponible aún. Añade una captura en ./img/searcher-banners.jpg y descomenta la línea siguiente.

---

Comportamiento

• El title raíz se muestra como encabezado de la sección de banners dentro del panel de búsqueda.
• Cada ítem con visible: true se renderiza como un banner clicable.
• Los ítems con visible: false no se muestran, pero permanecen en el JSON para poder reactivarlos fácilmente.
• Si link.url tiene valor, el banner completo (imagen + título) es clicable hacia esa URL.

---

Configuración

El JSON se introduce en el cuerpo del content asset en Business Manager → Content Assets.

{
  "title": "HAWKERS",
  "items": [
    {
      "visible": true,
      "title": "GAFAS POLARIZADAS",
      "image": "images/searcher_banners/polarizadas.jpg?$staticlink$",
      "link": {
        "url": "$url('Search-Show', 'cgid', 'polarizadas')$",
        "target": "_self"
      }
    },
    {
      "visible": true,
      "title": "NOVEDADES",
      "image": "images/searcher_banners/novedades.jpg?$staticlink$",
      "link": {
        "url": "$url('Search-Show', 'cgid', 'novedades')$",
        "target": "_self"
      }
    },
    {
      "visible": false,
      "title": "OUTLET",
      "image": "images/searcher_banners/outlet.jpg?$staticlink$",
      "link": {
        "url": "$url('Search-Show', 'cgid', 'outlet')$",
        "target": "_self"
      }
    }
  ]
}

---

Propiedades

Propiedad	Tipo	Obligatorio	Descripción
title	string	No	Título de la sección de banners dentro del panel de búsqueda.
items	array	Sí	Lista de banners. El orden del array define el orden visual.
items[].visible	boolean	Sí	Si false, el banner no se renderiza.
items[].title	string	No	Texto del banner, visible sobre o bajo la imagen.
items[].image	string	Sí	Ruta de la imagen del banner. Debe terminar en ?$staticlink$.
items[].link.url	string	No	URL de destino al hacer clic en el banner. Admite expresiones $url de SFCC.
items[].link.target	string	No	"_self" (misma pestaña) o "_blank" (nueva pestaña).

---

Notas y consejos

Fichero de plantilla

components/searcher/banners.isml

Ocultar un banner sin eliminarlo

Usa visible: false para desactivar temporalmente un banner sin borrarlo del JSON. Así puedes reactivarlo rápidamente cuando vuelva a ser relevante:

{ "visible": false, "title": "OUTLET", "image": "...", "link": {...} }

Expresiones $url para los enlaces

Usa expresiones $url de SFCC para que los enlaces funcionen en todos los entornos:

"url": "$url('Search-Show', 'cgid', 'ID_DE_CATEGORIA')$"
"url": "$url('Product-Show', 'pid', 'ID_DE_PRODUCTO')$"
"url": "$url('Page-Show', 'cid', 'ID_DE_PAGINA')$"

Imágenes: recuerda ?$staticlink$

"image": "images/searcher_banners/mi-banner.jpg?$staticlink$"