Skip to main content
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Full-Page Chatbot</title>
  <style>
    /* Full-page container for the chatbot */
    #full-page-chat {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 9999; /* Ensure it overlays all other content */
    }
  </style>
</head>
<body>

  <!-- Chatbot container -->
  <div id="full-page-chat"></div>

  <!-- VoiceFlow Chatbot Script -->
  <script type="text/javascript">
    (function(d, t) {
        var v = d.createElement(t), s = d.getElementsByTagName(t)[0];
        v.onload = function() {
          window.voiceflow.chat.load({
            verify: { projectID: '6722b4f59c775717850a38cb' },
            url: 'https://general-runtime.voiceflow.com',
            versionID: 'production',
            render: {
              mode: 'embedded',
              target: document.getElementById('full-page-chat')
            },
            autostart: true
          });
        };
        v.src = "https://cdn.voiceflow.com/widget/bundle.mjs"; 
        v.type = "text/javascript"; 
        s.parentNode.insertBefore(v, s);
    })(document, 'script');
  </script>

</body>
</html>