add dosify integration

aircodelabs · Sep 19, 2023 · f2537ae · f2537ae
1 parent e6d1be0
commit f2537ae
Show file tree

Hide file tree

Showing 4 changed files with 27 additions and 1 deletion.
diff --git a/docs/.vitepress/config.ts b/docs/.vitepress/config.ts
@@ -55,6 +55,12 @@ export default defineConfig({
           { text: 'Start with Native JS', link: '/getting-started/vanilla-js' }
         ]
       },
+      {
+        text: 'Integration',
+        items: [
+          { text: 'Integration to Docsify', link: '/integration/docsify' },
+        ]
+      },
       {
         text: 'Reference',
         items: [

diff --git a/docs/developments/docsify.md b/docs/developments/docsify.md
diff --git a/docs/getting-started/index.md b/docs/getting-started/index.md
@@ -14,10 +14,13 @@ Please choose a framework below to get started:
 - [General Vue Project](/getting-started/general-vue)
 - [Vanilla JS](/getting-started/vanilla-js)
 
+Documate can also be manually integrated to other library or frameworks.
+
+- [Docsify](/integration/docsify)
+
 The following frameworks are coming soon:
 
 - Docusaurus
-- Docsify
 - Vuepress
 - Docus
 - Nextra

diff --git a/docs/integration/docsify.md b/docs/integration/docsify.md
@@ -0,0 +1,17 @@
+# Integration to Docsify
+
+It's very easy to integrate Documate into Docsify. You just need to follow the [Native JavaScript Startup](/getting-started/vanilla-js) guide to import js and provide a button with the ID `ask-ai` in your doc's `index.html` page.
+
+```html
+<button id="ask-ai" data-endpoint="https://xxxxxxxx.us.aircode.run/ask"></button>
+...
+<script src="https://unpkg.com/@documate/ui"></script>
+```
+
+You can place the button anywhere you like, but the most convenient way is to [enable the NavBar](https://docsify.js.org/#/configuration?id=loadnavbar) and then place the button on the NavBar.
+
+There is an [online Example](https://spritejs.vercel.app/#/).
+
+<img src="https://aircode-yvo.b-cdn.net/resource/14-y607yzcv44.jpg" width="400">
+
+<img src="https://aircode-yvo.b-cdn.net/resource/1695090094690-cbh1nh85p3.jpg" width="400">