Docq Embeddable Widget

The Docq Embeddable Widget is a tool that allows you to seamlessly integrate the Docq public chat interface into your website.

Overview

For a comprehensive understanding of Docq, please refer to the official documentation:

• Overview
• User Guide
• Developers Guide

Usage

Option 1: Dynamic Embed

To dynamically embed the widget, copy and paste the following code into your website, replacing placeholders with the appropriate values:

<div id="docq-widget"><i>Loading widget...</i></div>
<script>
  (function(d, o, c, q, a, i) {
    i = o.createElement('script');i.async = 1;i.src = c;d['__DocqSID'] = a;
    a = o.getElementsByTagName('script')[0];a.parentNode.insertBefore(i, a);d['__Docq'] = q;
  })(window, document, 'https://cdn.jsdelivr.net/gh/docqai/widget@main/public/widget.js', 'docq-host-url', 'org-id:space-group-id')
</script>

Example 1: Dynamic Embed

The following code will load the widget from a server at http://localhost:8501 with the organization ID 1000 and space group ID 1:

<div id="docq-widget"><i>Loading widget...</i></div>
<script>
  (function(d, o, c, q, a, i) {
    i = o.createElement('script');i.async = 1;i.src = c;d['__DocqSID'] = a;
    a = o.getElementsByTagName('script')[0];a.parentNode.insertBefore(i, a);d['__Docq'] = q;
  })(window, document, 'http://localhost:8501', '1000:1')

Option 2: Static Embed

To statically embed the widget, copy and paste the following code into your website, replacing placeholders with the appropriate values:

<div id="docq-widget"><i>Loading widget...</i></div>
<script src="https://cdn.jsdelivr.net/gh/docqai/widget@main/public/widget.js"
 docq-host-url="docq-host-url" docq-config="org-id:space-group-id"
></script>

Example 2: Static Embed

The following code will load the widget from a server at http://localhost:8501 with the organization ID 1000 and space group ID 1:

<div id="docq-widget"><i>Loading widget...</i></div>
<script src="https://cdn.jsdelivr.net/gh/docqai/widget@main/public/widget.js" docq-host-url="http://localhost:8501" docq-config="1000:1"></script>

Screenshots

Minimized state

Opened State

Placeholders

Below is a list of placeholders that are used and what they represent:

• docq-host-url: URL of the Docq server
• org-id: Organization ID
• space-group-id: Space Group ID
• docq-config: Configuration string in the format org-id:space-group-id