Mintlify Integration

Add Ask0's AI assistant to your Mintlify documentation platform. Learn how to integrate intelligent search and chat features into your Mintlify-powered docs.

Add Ask0 to your Mintlify documentation site.

Installation

Using mint.json

Add the script to your Mintlify configuration:

mint.json

{
  "name": "My Docs",
  "navigation": [...],
  "analytics": {
    "customScripts": [
      {
        "src": "https://assets.ask0.ai/scripts/ask.js",
        "async": true,
        "defer": false,
        "attributes": {
          "data-project-id": "YOUR_PROJECT_ID",
          "data-position": "bottom-right",
          "data-theme": "auto"
        }
      }
    ]
  }
}

Custom Component

Create a custom component for more control:

components/Ask0.jsx

import { useEffect } from 'react';

export default function Ask0() {
  useEffect(() => {
    const script = document.createElement('script');
    script.src = 'https://assets.ask0.ai/scripts/ask.js';
    script.dataset.projectId = process.env.NEXT_PUBLIC_ASK0_PROJECT_ID;
    script.async = true;
    document.body.appendChild(script);

    return () => {
      document.body.removeChild(script);
    };
  }, []);

  return null;
}

Then import in your MDX pages:

import Ask0 from '/components/Ask0';

<Ask0 />

...

Theme Synchronization

Sync with Mintlify's theme:

components/Ask0Synced.jsx

import { useEffect } from 'react';
import { useTheme } from 'next-themes';

export default function Ask0Synced() {
  const { theme } = useTheme();

  useEffect(() => {
    const script = document.createElement('script');
    script.src = 'https://assets.ask0.ai/scripts/ask.js';
    script.dataset.projectId = process.env.NEXT_PUBLIC_ASK0_PROJECT_ID;
    script.dataset.theme = theme === 'dark' ? 'dark' : 'light';
    script.async = true;
    document.body.appendChild(script);

    return () => {
      document.body.removeChild(script);
    };
  }, [theme]);

  return null;
}

Environment Variables

.env

NEXT_PUBLIC_ASK0_PROJECT_ID=your_project_id

Mintlify Tips:

Use customScripts in analytics section for global loading
Custom components give more control over behavior
Mintlify uses Next.js under the hood
Widget automatically adapts to Mintlify's theme