Documentation System 📚

Indie Kit comes with a powerful, production-ready documentation system. Write MDX files, and everything else is handled automatically! ✨

What You Get Out of the Box 🎁

Your docs come with incredible features built-in:

• 🤖 Automatic llms.txt - AI-ready content for ChatGPT and other platforms
• 🔍 Built-in Search - Lightning-fast fuzzy search
• 🖼️ Auto OG Images - Social media cards for every page
• 📋 Copy as Markdown - One-click copy for sharing
• 🗺️ Automatic Sitemap - SEO handled automatically
• 🎨 Icon Support - Add icons to pages effortlessly
• 📱 Mobile Responsive - Perfect on all devices

AI Integration 🤖

Your docs are automatically LLM-ready:

llms.txt Generation

Every time you add content, llms.txt is automatically generated with:

• Structured content for AI consumption
• Proper formatting for ChatGPT, Claude, and other LLMs
• Optimized for context window efficiency

Open in ChatGPT

Users can open any doc page directly in ChatGPT with one click! The "Open in ChatGPT" button:

• Shares the page content with proper context
• Works with Claude and other AI platforms
• Includes markdown formatting

Copy as Markdown

The "Copy as Markdown" feature lets users:

• Copy entire pages with formatting intact
• Share in Slack, Discord, or anywhere
• Preserve code blocks and structure

Adding Content 📝

Adding new documentation is super simple:

Step 1: Create Your MDX File

Drop your .mdx file in content/docs/:

content/docs/
  ├── getting-started.mdx
  ├── your-new-page.mdx
  └── advanced/
      └── custom-feature.mdx

Step 2: Add Frontmatter

Every page needs frontmatter:

---
title: Your Page Title
description: A helpful description for SEO
icon: Rocket
---

# Your Content Here

Write your documentation in MDX format!

Step 3: That's It! ✨

Your page is now:

• ✅ Searchable
• ✅ Has an OG image
• ✅ In the sitemap
• ✅ Available to AI
• ✅ Mobile responsive

Customization 🎨

Custom OG Images

Want to customize social media preview images?

Edit the OG image generator:

src/app/api/og/route.tsx

Modify the template to match your branding:

// Customize colors, fonts, layout
<div style={{ 
  background: 'linear-gradient(to bottom, #your-colors)',
  // Your custom styles
}}>
  {/* Your custom OG image template */}
</div>

Icons

Add icons to any page using Lucide icons:

---
title: My Page
icon: Rocket  # Any Lucide icon name
---

Common icons:

• 🚀 Rocket - Getting started
• 📚 Book - Documentation
• ⚙️ Settings - Configuration
• 🔐 Lock - Security
• 💳 CreditCard - Payments

Navigation Structure

Control sidebar navigation in meta.json:

{
  "title": "Section Name",
  "pages": ["page-1", "page-2"],
  "icon": "Folder"
}

Features in Detail ⚡

Search Implementation

Fuzzy search is automatically enabled:

• Search across all content
• Keyboard shortcuts (Cmd+K or Ctrl+K)
• Instant results
• No configuration needed

Automatic Sitemap

Your sitemap.xml is generated automatically:

• All documentation pages included
• Proper priority and change frequency
• Submitted to search engines

Mobile Navigation

Responsive by default:

• Collapsible sidebar
• Touch-friendly navigation
• Optimized for small screens

Best Practices 💡

Writing Great Docs

1. Clear Titles - Descriptive and searchable
2. Use Callouts - Highlight important information
3. Code Examples - Show, don't just tell
4. Short Sections - Break up long content
5. Emojis - Make it friendly and scannable

Organizing Content

content/docs/
  ├── getting-started.mdx      # First steps
  ├── setup/                   # Installation guides
  ├── features/                # Feature documentation
  ├── guides/                  # How-to guides
  └── api/                     # API reference

Using MDX Features

MDX supports React components:

<Callout title="Important" type="warning">
This is a callout component!
</Callout>

Next Steps 🚀

Now that you understand the docs system:

1. Add Your Content - Start writing in content/docs/
2. Customize Branding - Update OG images and colors
3. Organize Navigation - Structure your meta.json files
4. Test Search - Make sure content is discoverable

Need Help? 💬

• Check Fumadocs documentation
• View MDX syntax guide