Instala FIGI en un sitio HTML

Esta guía sirve para cualquier sitio en el que puedas editar el HTML: un sitio propio, un generador estático o un framework.

Antes de empezar

• Copia el código del asset desde FIGI (Activación digital → Despliegue). Tiene un div y un script, como se explica en Instala los assets de FIGI en tu sitio.
• Pídele a un administrador de FIGI que agregue tu dominio en Sitios autorizados, por ejemplo https://www.tu-sitio.com.

1. Pega el script una vez por página

Pégalo justo antes de </body> en la plantilla general del sitio:

<script src="https://figi.video/embed/v1/figi.js" data-figi-key="TU-CLAVE" async></script>

Usa la línea exacta que copiaste de FIGI. El atributo async evita que el script frene la carga de tu página.

2. Pon el div donde quieres el asset

<div data-figi-feed="ID-DE-TU-SLIDER"></div>

Para mostrar varios assets en la misma página, repite el div con el ID de cada uno y deja un solo script:

<div data-figi-feed="ID-DEL-SLIDER-1"></div>
<div data-figi-feed="ID-DEL-SLIDER-2"></div>
<script src="https://figi.video/embed/v1/figi.js" data-figi-key="TU-CLAVE" async></script>

3. Si tu sitio es de una sola página

Si el sitio cambia de ruta sin recargar (React, Vue, Angular, Next.js con navegación del lado del cliente), el script solo monta los assets que existen cuando carga. Después de cada cambio de ruta, monta los nuevos:

document.querySelectorAll("[data-figi-feed]:not([data-figi-state])").forEach(function (element) {
  element.setAttribute("data-figi-state", "loading");
  window.figi.mount(element, element.getAttribute("data-figi-feed"));
});

window.figi.mount devuelve una promesa con una función para desmontar el asset, útil si tu framework destruye el componente.

Verifica

1. Recarga la página. El asset aparece en unos segundos.
2. Con las herramientas de desarrollo (F12), el div tiene que tener data-figi-state="ready". Si dice unavailable, el atributo data-figi-reason explica la causa.
3. En la pestaña Red, las solicitudes a /api/public/events tienen que responder 202. Si responden 403, falta autorizar el dominio.

Ventas y seguridad

• Para registrar ventas en la página de confirmación, sigue Registra las ventas.
• Si tu sitio usa una política de seguridad de contenido, revisa los dominios en Política de seguridad de contenido (CSP).

Para otros problemas, mira Problemas comunes en la guía general.