Widget Gaia Chatbot

Visión general

Este widget de chatbot gaia es una solución ligera y personalizable para integrar una interfaz de chat basada en IA en cualquier página web. Proporciona una forma interactiva para que los usuarios interactúen con su asistente de IA, mejorando la experiencia del usuario y proporcionando apoyo o información instantánea.

información

El código fuente completo y las instrucciones detalladas para configurar y ejecutar este ejemplo se pueden encontrar en el repositorio Gaia Cookbook.

Características

• Fácil de incrustar en cualquier página HTML
• Aspecto personalizable para adaptarse al diseño de su sitio web
• Admite markdown y formato de código en las respuestas
• Diseño adaptable a dispositivos móviles y de sobremesa
• Comportamiento y apariencia del chatbot configurables

Instalación

1. Incluye el script del chatbot en tu archivo HTML:

<script src="https://cdn.jsdelivr.net/gh/harishkotra/embeddadble-chatbot-ui@refs/heads/main/chatbot-widget.js"></script>

2. Añada el objeto de configuración a su página:

<script>
    window.CHATBOT_CONFIG = {
        apiKey: "YOUR_API_KEY",
        apiUrl: "https://YOUR_NODE_ID.gaia.domains/v1/chat/completions",
        botTitle: "AI Assistant",
        welcomeMessage: "Hello! How can I assist you today?",
        placeholderText: "Type your message here...",
        brandColor: "#000000",
        chatHeaderBackground: "#ffffff",
        chatHeaderTextColor: "#000000",
        chatBubbleBackgroundUser: "#000000",
        chatBubbleTextColorUser: "#ffffff",
        chatBubbleBackgroundBot: "#f2f2f2",
        chatBubbleTextColorBot: "#000000",
        systemMessage: "You are a helpful assistant.",
        maxResponseTokens: 1000,
        temperatureValue: 0.7,
        suggestedQuestions: [
            "What services do you offer?",
            "How can I contact support?",
            "Tell me about your company"
        ]
    };
</script>

3. El widget del chatbot se inicializará automáticamente y aparecerá en tu página.

Opciones de configuración

Opción	Tipo	Descripción	Por defecto
apiKey	Cadena	Su clave API para la autenticación	Requerido
apiUrl	Cadena	La URL del punto final para la API de finalización de chat	Requerido
botTitle	Cadena	El título que aparece en la cabecera del chat	"Asistente AI"
welcomeMessage	Cadena	El mensaje inicial que muestra el bot	"¡Hola! ¿En qué puedo ayudarle hoy?"
marcadorTexto	Cadena	Texto para el campo de entrada	"Escriba su mensaje aquí..."
marcaColor	Cadena	Color primario del chatbot (HEX)	"#000000"
chatHeaderBackground	Cadena	Color de fondo de la cabecera del chat (HEX)	"#ffffff"
chatHeaderTextColor	Cadena	Color del texto de la cabecera del chat (HEX)	"#000000"
chatBubbleBackgroundUser	Cadena	Color de fondo de las burbujas de mensajes de usuario (HEX)	"#000000"
chatBubbleTextColorUser	Cadena	Color del texto de las burbujas de mensajes de usuario (HEX)	"#ffffff"
chatBubbleBackgroundBot	Cadena	Color de fondo de las burbujas de mensajes del bot (HEX)	"#f2f2f2"
chatBubbleTextColorBot	Cadena	Color del texto de las burbujas de mensajes del bot (HEX)	"#000000"
systemMessage	Cadena	Mensaje inicial del sistema para establecer el comportamiento del bot	"Eres un ayudante servicial".
maxResponseTokens	Número	Número máximo de tokens en la respuesta del bot	1000
temperaturaValor	Número	Aleatoriedad de las respuestas del bot (0-1)	0.7
Preguntas sugeridas	Matriz	Lista de preguntas sugeridas para mostrar	[]

Compatibilidad con navegadores

Este widget es compatible con navegadores modernos como Chrome, Firefox, Safari y Edge. Internet Explorer no es compatible.

información

El código fuente completo y las instrucciones detalladas para configurar y ejecutar este ejemplo se pueden encontrar en el repositorio Gaia Cookbook.