Demostración del Widget de Chat Rafiko

Este es un ejemplo de cómo integrar el widget de chat en tu sitio web.

Código de integración:

Uso como componente React:

            
              import { ChatbotWidget } from 'my.agent.widget';

              // En tu componente React:
              <ChatbotWidget
                config={{
                  widgetTitle: "Rafiko responde",
                  welcomeMessage: "¡Hola soy Rafiko! ¿En qué puedo ayudarte?",
                  position: "bottom-right",
                  primaryColor: "#000000ff",
                  secondaryColor: "#EFF6FF"
                }}
              />
            
          

Uso como widget embebido:

            
              <!-- 1. Incluir el CSS -->
              <link rel="stylesheet" href="https://my-agent-widget.vercel.app/static/css/main.css">

              <!-- 2. Incluir el JavaScript -->
              <script src="https://my-agent-widget.vercel.app/static/js/main.js"></script>

              <!-- 3. Insertar el widget -->
              <div id="chat-widget"></div>

              <!-- 4. Inicializar el widget -->
              <script>
                window.onload = function() {
                  new ChatbotWidget(document.getElementById('chat-widget'), {
                    widgetTitle: "Rafiko responde",
                    welcomeMessage: "¡Hola soy Rafiko! ¿En qué puedo ayudarte?",
                    position: "bottom-right",
                    primaryColor: "#000000ff",
                    secondaryColor: "#EFF6FF"
                  });
                };
              </script>