Skip to main content
La página Widgets web (/dashboard/web-widgets) crea y administra las claves publicables que impulsan el widget de voz insertable de ThunderPhone. Todo lo que la versión de API de esta guía hace con cURL, esta página lo hace con un formulario, además de generar el código de inserción por ti.

Crea un widget

1

Haz clic en Nuevo widget y elige un modo

  • Modo de agente — el widget siempre ejecuta un agente que eliges en el menú desplegable. La configuración más sencilla.
  • Modo webhook — en cada sesión del widget, ThunderPhone llama a la URL de tu webhook y tu servidor devuelve la configuración del agente para ese visitante (enrutamiento por página, usuarios con sesión iniciada, lanzamientos graduales). Deja la URL en blanco para usar el webhook predeterminado de tu organización; cuando ingreses una URL nueva, también puedes establecerla como predeterminada de la organización.
2

Enumera los dominios permitidos

Las claves publicables están restringidas por origen: se requiere al menos un dominio, y el widget solo funciona en los nombres de host que enumeres. Se permiten comodines de subdominio como *.example.com (coinciden con subdominios, no con el dominio raíz); se rechazan los comodines sin dominio como *. localhost y 127.0.0.1 siempre están permitidos, por lo que el desarrollo local funciona sin necesidad de enumerarlos.
3

Ponle un nombre, actívalo y créalo

El interruptor Activar widget controla si la clave acepta sesiones; puedes crear un widget desactivado y activarlo al momento del lanzamiento.

Obtén el código de inserción

Justo después de crearlo (o mediante el botón Insertar de cada fila), un cuadro de diálogo de inserción genera código listo para pegar con tu clave publicable incluida:
  • React — un fragmento <ThunderPhoneWidget /> para aplicaciones con empaquetador.
  • Etiqueta de script — un par de <script> de CDN y hoja de estilos para cualquier sitio.
El cuadro de diálogo también muestra una vista previa de las opciones básicas de apariencia: título, color principal, posición de la esquina y tema claro/oscuro, e incorpora tus elecciones en el fragmento. Para consultar la referencia completa de props, los hooks de estilos y la opción headless, consulta la documentación del SDK del widget.
Las claves publicables (pk_live_…) son públicas por diseño: puedes incluirlas sin riesgo en código de front-end. Copia una en cualquier momento con el botón Copiar de su fila.

Administra widgets desde la lista

Cada fila se edita directamente:
  • Modo / Agente — cambia entre el modo de agente y webhook, o redirige el agente, con selectores integrados.
  • Dominios — agrega o elimina dominios permitidos como etiquetas.
  • Activar/desactivar — un interruptor por widget; los widgets desactivados dejan de aceptar sesiones de inmediato.
  • Transferir a organización — copia o mueve el widget a otra organización a la que pertenezcas (moverlo lo elimina de aquí).
  • Eliminar — revoca la clave publicable; el widget deja de funcionar de inmediato en todos los dominios. Esto no se puede deshacer.
Las sesiones del widget aparecen en el historial de llamadas con la misma transcripción, grabación y evaluación que las llamadas telefónicas.

Próximos pasos

Referencia del SDK del widget

Detalles del componente de React, hook headless y script de CDN.

Enrutamiento en modo webhook

Devuelve la configuración del agente por visitante desde tu servidor.