How to Embed a Widget in Document360

1. Prerequisites

• •An active Embeddy account with at least one published widget.
• •A Document360 account with Team Member (Editor) or Admin access.
• •Your Embeddy iframe embed code -- copy it from your widget's Embed tab in the dashboard.
• •A Document360 knowledge base project with at least one published category.

<iframe
  src="https://embeddy.ai/webhost/WIDGET_ID?widget_props_id=PROPS_ID"
  width="100%"
  height="500"
  frameborder="0">
</iframe>

2. Method 1 -- Custom HTML Block (Recommended)

Document360's article editor includes a Custom HTML content block that accepts and renders raw HTML, including iframes and scripts. This is the fastest and most reliable way to embed an Embeddy widget in a knowledge base article.

1. 1

   Open the article in Document360

   Log in to your Document360 portal and navigate to Knowledge Base. Select the category and article you want to edit, or create a new article.

2. 2

   Add a Custom HTML block

   In the article editor, place your cursor where you want the widget. Click the + button (or type / to use the slash command menu) and select Custom HTML from the block options.

3. 3

   Paste your Embeddy iframe code

   A code editor will appear. Paste your Embeddy iframe embed code into the Custom HTML block:

   <!-- Embeddy Interactive Widget -->
   <div style="margin: 20px 0; max-width: 100%; border-radius: 8px; overflow: hidden;">
     <iframe
       src="https://embeddy.ai/webhost/WIDGET_ID?widget_props_id=PROPS_ID"
       width="100%"
       height="500"
       frameborder="0"
       allow="clipboard-write">
     </iframe>
   </div>

4. 4

   Preview the rendering

   Document360 will render a live preview of the Custom HTML block directly in the editor. Verify the widget appears correctly. You can also click Preview in the top bar to see the full article view.

5. 5

   Publish the article

   Click Publish (or submit for review if your workflow requires approval). The widget will be visible to your knowledge base readers once the article is live.

3. Method 2 -- Markdown Editor with HTML

If you prefer writing articles in Markdown, Document360's Markdown editor supports inline HTML. You can paste iframe code directly into your Markdown content and it will render on the published page.

1. 1

   Open or create an article in Markdown mode

   In Document360, open the article editor and ensure it is set to Markdown mode. You can toggle between WYSIWYG and Markdown in the editor settings.

2. 2

   Add your iframe as inline HTML

   In the Markdown editor, add your Embeddy iframe code as raw HTML. Leave a blank line before and after the HTML block:

   ## Troubleshooting Tool
   
   Use the interactive troubleshooter below to diagnose your issue:
   
   <div style="margin: 20px 0;">
     <iframe
       src="https://embeddy.ai/webhost/WIDGET_ID?widget_props_id=PROPS_ID"
       width="100%"
       height="500"
       frameborder="0">
     </iframe>
   </div>
   
   If the troubleshooter does not resolve your issue, please
   [contact support](/contact).

3. 3

   Preview and publish

   Click Preview to verify the iframe renders correctly alongside your Markdown content, then Publish the article.

4. Method 3 -- Site-Level Code Injection

Document360 allows admins to inject custom JavaScript and CSS across the entire knowledge base site. This is ideal for adding a floating widget, analytics tracking, or a persistent interactive tool on every page.

1. 1

   Open Knowledge Base Settings

   In Document360, go to Settings > Knowledge Base Portal > Custom Javascript / CSS (or Appearance > Advanced depending on your version).

2. 2

   Add your widget script

   In the Custom JavaScript field, paste the following script to add a floating Embeddy widget:

   // Embeddy Widget - Site-wide Document360
   (function() {
     var iframe = document.createElement('iframe');
     iframe.src = 'https://embeddy.ai/webhost/WIDGET_ID?widget_props_id=PROPS_ID';
     iframe.style.cssText = 'position:fixed;bottom:20px;right:20px;width:380px;height:500px;border:none;z-index:9999;border-radius:12px;box-shadow:0 4px 24px rgba(0,0,0,0.15);';
     document.body.appendChild(iframe);
   })();

3. 3

   Save and verify

   Click Save. Visit your Document360 knowledge base site and verify the widget appears. The script runs on every page load.

5. Troubleshooting

6. FAQ