How do I add the Orbita COVID-19 Chatbot to my site?

The following steps outline the specific actions needed to integrate the Orbita COVID-19 chatbot into your website. The following steps must be performed on a page hosted on a domain registered with Orbita.

Installation Requirements

The Orbita COVID-19 Chatbot will only run on a website domain(s) whitelisted by Orbita. Requests to whitelist domains must be made by submitting this form. If you would like to integrate the chatbot into more than three website domains, please email sales@orbita.ai.
The Orbita COVID-19 Chatbot must run on a secure HTTPS website and will not load on a website when accessed over HTTP. (If your site doesn’t use HTTPS currently, learn why it should).

Instructions

HTML Page - Create a new HTML page on your website containing the following HTML markup. Please copy the HTML markup exactly as it is below, without modification. No changes are needed to the markup. Please make sure to note the name and location of this file. It must reside in a web accessible folder. You’ll need the name and location information in subsequent steps.

 <html> 
  <head> 
    <meta name="viewport" content="width=device-width, initial-scale=1" /> 
    <title>Chat Bot</title> 
  </head> 
  <body style="margin:0px;padding:0px;overflow:hidden"> 
    <iframe frameborder="0" id="bot-frame" style="overflow:hidden;overflow-x:hidden;overflow-y:hidden;height:100%;width:100%;position:absolute;top:0px;left:0px;right:0px;bottom:0px" height="100%" width="100%" > 
    </iframe> 
    <script> 
      var iframeSrc = "https://engage.orbita.cloud/oeapi/bot/hub/orbita" + window.location.search; 
      document.getElementById("bot-frame").src = iframeSrc; 
    </script> 
  </body> 
</html>

2. HTML Container - Identify the specific HTML page or template where you want the Orbita COVID-19 chatbot to display on your website. Insert this markup in the location where it should display:

<div id="chatWindow"></div>

3. . jQuery – jQuery is required. If it’s already included on the HTML Page or template identified in Step #2, you can skip this step. Otherwise, include the following reference to jQuery. Any version greater than 1.0 is supported, however it is always best practice to use the latest version.

  <script
  src="https://code.jquery.com/jquery-3.4.1.min.js"
  integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
  crossorigin="anonymous"></script>

4. Chatbot Plugin – The following line of JavaScript includes the Orbita core chatbot library. Place the following script at the bottom of the page identified in Step #2.

5. Chatbot Plugin Settings – The following section of JavaScript includes settings that can be changed to modify the default behavior of the bot. Include the script at the bottom at the page, just beneath the JavaScript in Step #4.

Note: you must set mobileBotUrl to the name and location of the file created in in Step #1.

6. Custom CSS - The following CSS block should be included at the bottom of the page just after the script tag from Step #5.

7. Load the Chatbot – To verify that the chatbot is installed and configured properly, load the page containing the chatbot scripts in a browser. Reminder, the script must be hosted on a website whose domain is registered and whitelisted with Orbita.

Troubleshooting

If you’re having trouble loading the chatbot, first verify that you’ve followed the steps above exactly as documented. Additionally:

Verify the domain - Verify that the domain showing in your browser matches the exact domain whitelisted by Orbita. If you want the chatbot to appear on www.domain.com as well as sub.domain.com you need to request that both fully qualified domains are whitelisted.
Verify access over HTTPS - As mentioned in the IMPORTANT NOTES above, the Orbita COVID-19 Chatbot must run on a security HTTPS website. Verify that the URL you’re using to access your chatbot begins with https:// (notice the 's')
Look for JavaScript errors in the console - If the chatbot still fails to load, please open the developer console in your browser (Chrome, Safari, or any modern browser) and look for any JavaScript messages (errors, warnings, information) that might help point you in the direction of the issue.

If you’re unable to resolve the problem after verifying these items, please take a screen capture of any relevant error messages in the javascript console, and send a message to support@orbita.ai, making sure to include the domains you’ve whitelisted, organization name, and any other relevant information to help Orbita Support troubleshoot the issue further.