How to Add Asyntai AI Chatbot to Mintlify

Step-by-step guide for Mintlify docs

แพลตฟอร์ม:

ขั้นตอนที่ 1: รับโค้ดฝังตัวของคุณ

ก่อนอื่น ไปที่แดชบอร์ด Asyntai ของคุณและเลื่อนลงไปที่ส่วน "Embed Code" คัดลอกโค้ดฝังตัวเฉพาะของคุณซึ่งจะมีลักษณะดังนี้:

<script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>

หมายเหตุ: โค้ดด้านบนเป็นเพียงตัวอย่าง คุณต้องคัดลอกโค้ดฝังตัวเฉพาะของคุณจากแดชบอร์ดเนื่องจากมี widget ID ส่วนตัวของคุณ

Step 2: Create a Custom Script File

Mintlify automatically includes any .js file placed in your documentation content directory on every page of your site. This makes it the cleanest way to load the Asyntai widget across your entire docs. Start by creating a new JavaScript file in your content directory (the same folder that contains your docs.json file, or mint.json on older versions, alongside your MDX pages):

your-docs/
├── docs.json
├── introduction.mdx
├── quickstart.mdx
└── asyntai.js   <-- create this file

หมายเหตุ: You can name the file anything you like (for example asyntai.js), as long as it ends in .js and lives inside your content directory. Mintlify will pick it up automatically. This is equivalent to adding a <script> tag to every page of your documentation.

Step 3: Add the Widget Loader

Open your new asyntai.js file and paste the loader below. It creates the Asyntai script tag and appends it to the page. Replace YOUR_WIDGET_ID with the widget ID from your embed code:

(function () {
  var script = document.createElement('script');
  script.src = 'https://asyntai.com/static/js/chat-widget.js';
  script.setAttribute('data-asyntai-id', 'YOUR_WIDGET_ID');
  script.async = true;
  document.body.appendChild(script);
})();

เคล็ดลับ: Custom scripts in Mintlify run after the page becomes interactive, so wrapping the loader in a self-executing function keeps it clean and avoids polluting the global scope. The widget loads on every page automatically.

Step 4: Commit and Deploy

Mintlify builds your documentation from your connected Git repository, so the new file only goes live after you push it:

Save your asyntai.js file
Commit the file to your documentation repository
Push the change to the branch connected to Mintlify (usually main)
Mintlify will automatically rebuild and deploy your docs site
Wait for the deployment to finish, then visit your live docs

หมายเหตุ: If you use the Mintlify CLI for local development, run mint dev to preview the widget locally before pushing. Custom scripts also load in the local preview.

Step 5: Verify Installation

After the deployment completes, open your Mintlify docs site in a new browser tab or incognito window. You should see the chat widget button in the bottom right corner. Click it to ensure it opens and functions correctly.

ไม่เห็นวิดเจ็ต? Make sure your .js file is inside the content directory (next to docs.json) and that the change was pushed and deployed. Confirm the deployment finished successfully in your Mintlify dashboard. Clear your browser cache or view in incognito mode, and check the browser console (F12) for any JavaScript errors.

ต้องการความช่วยเหลือ?

If you're not comfortable editing files in your documentation repository, Mintlify's support team can help with custom scripts and configuration. You can also contact Asyntai support for guidance on installing the chatbot on your Mintlify docs.

การสนับสนุนระดับมืออาชีพ: Mintlify's documentation and community resources cover custom scripts in detail if you need help configuring more advanced integrations.