Widget: Desplegar tu Agente en una página web

En esta sección explicamos el paso a paso para desplegar el agente de texto en un sitio web a través de un Widget

Widget para Sitios Web

Dentro de tu agente, hac click en Channels

Y elige Dapta Widget, Ahora iremos paso a paso para configurar el widget que podrás incrustar en cualquier página web.

• Agent ID:

  Este código ya viene por defecto. Es el identificador único de tu agente de texto.

• Embedded:

La línea de código que debes copiar y pegar en el código HTML del sitio web donde quieres incrustar tu agente de texto.

• Instrucciones adicionales:

Estas instrucciones son opcionales, y sirven para que tu agente pueda leer parámetros para entender mejor contexto adicional de las conversaciones. Estas instrucciones se añadirán a cada mensaje que envíe un cliente para que tu agente pueda usarlas para comprender un contexto adicional de la conversación. Si configura los parámetros de la conversación mediante la función setConversationParams(object) en el lado del cliente, puede usarlos aquí.

Agrega este script a tu código para que puedas usar los parámetros de conversación como variables aquí Por defecto tienes estos parámetros:

• user_id: ID del usuario

• user_name: Nombre del usuario

• user_email: Email del usuario

Voice Agent:

Dapta te brinda esta gran alternativa,

dentro de tu agente de texto, tienes un tab 📞 para que si tu cliente prefiere le puedas hacer una llamada:

En esta sección de Voice Agent puedes seleccionar la voz del agente de inteligencia artificial que realizaría esta llamada.

El agente que selecciones será quien llame a los usuarios que registren sus datos de contacto en esta sección (Phone Number, Contact Name and Contact Email)

Welcome Message

Aquí puedes editar una breve descripción de como el agente de texto debe iniciar la conversación con tus usuarios.

Default Questions:

En esta sección puedes añadir preguntas accionables que aparecen como opciones a hacer click por el usuario, son de mucha ayuda para iniciar la conversación con tu agente.

Puedes hacerlo de dos formas:

• Añadir Pregunta Ejemplo de forma Manual

• Le das click a "+ Add Example" y escribes la pregunta que te gustaría aparezca en tu agente. Puedes añadir las preguntas que desees, pero ten siempre en cuenta la experiencia del usuario con tu agente.

• Dale click a "Save Changes", y cuando vuelvas a entrar a Widget, verás que las preguntas ahora aparecen en tu agente:

• Generar Preguntas con IA

• Le das click a la opción "Generate with AI", y nuestra IA generará en base al contexto y a las instrucciones preguntas sugeridas para que tus usuarios inicien la interacción con tu agente.

• Dale click a "Save Changes", y cuando vuelvas a entrar a Widget, verás que las preguntas ahora aparecen en tu agente:

Estilo del Widget

En esta sección puedes editar el estilo del widget, La formá básica es eligiendo color Primario personalizado, y colores de fondo claro u oscuro

La forma avanzada es con la hoja de estilos escribiendo el script de CSS

La opción "Auto Open" permite elegir si por defecto se abre automáticamente en páginas específicas. Separa con el símbolo "/" las páginas donde deseas aparezca tu widget.

Si está vacío, se abrirá automáticamente en todas las páginas al actualizar.