Skip to main content

Header Menu - Footer

Widget configurable que define la sección de pie de página del menú de navegación (drawer) de la cabecera, visible principalmente en dispositivos móviles cuando el menú lateral está desplegado. Permite administrar de forma centralizada enlaces de utilidad inmediata para el usuario, tales como atención al cliente, contacto, estado del pedido o localizador de tiendas físicas.

Vista previa​

Pie de página del menú de navegación en móvil

Comportamiento​

  • Anclaje en Menú Lateral: El widget se renderiza de forma fija o al final del flujo scrollable dentro del drawer o menú móvil desplegable del header.
  • Gestión Simplificada: Permite añadir, reordenar y renombrar los accesos directos desde el propio JSON del Content Asset sin modificar plantillas.
  • Soporte de Enlaces Dinámicos: Los destinos de los enlaces aceptan expresiones nativas de Salesforce Commerce Cloud (SFCC) para mantener las rutas funcionales en todos los entornos:
    • Páginas de contenido (assets): $url('Page-Show', 'cid', 'atencion-al-cliente')$
    • Controladores específicos: $url('Stores-Find')$ o $url('ContactUs-Show')$
    • Categorías y búsquedas: $url('Search-Show', 'cgid', 'ID_CATEGORIA')$

Configuración​

Content Asset​

El content asset se configura mediante un JSON en Business Manager → Content Assets con el ID de recurso correspondiente (normalmente menu-footer).

{
  "title": "Contacto",
  "links": [
    {
      "text": "Atención al cliente",
      "url": "$url('Page-Show', 'cid', 'atencion-al-cliente')$",
      "target": "_self"
    },
    {
      "text": "Localizador de tiendas",
      "url": "$url('Stores-Find')$",
      "target": "_self"
    },
    {
      "text": "Contacto",
      "url": "$url('ContactUs-Show')$",
      "target": "_self"
    }
  ]
}

Propiedades​

PropiedadTipoObligatorioDescripción
titlestringNoTítulo principal de encabezado para el bloque de enlaces del menú lateral (ej. "Contacto", "Ayuda").
linksarraySíListado de enlaces que se renderizarán verticalmente en el pie del menú.
links[].textstringSíTexto visible del enlace mostrado al usuario (ej. "Atención al cliente").
links[].urlstringSíDirección URL de destino. Admite expresiones dinámicas $url de SFCC.
links[].targetstringNoDestino de apertura del navegador al hacer clic ("_self" o "_blank").

Notas y consejos​

Ficheros

components/header/footer.isml

Enlaces dinámicos ($url)

Se recomienda encarecidamente utilizar las expresiones de $url dinámicas para las categorías y páginas internas. Esto asegura que la navegación no se rompa al migrar cambios de datos entre los entornos de Staging, Sandbox o Producción.

Diseño Compacto

Dado que este menú se renderiza dentro del viewport limitado de un dispositivo móvil (menú lateral), se aconseja no añadir más de 3 o 4 enlaces para evitar saturar visualmente el espacio inferior de navegación y asegurar que el botón de cerrar y las categorías principales mantengan el foco.