fumadocs-i18n

Automate multi-language i18n setup for Fumadocs projects with directory-based routing.

14|2|Updated Nov 15, 2025

Search Tags:#documentation #routing #Next.js #i18n #multilingual #sidebar #content-organization

Ready to run

npx skills add https://github.com/foreveryh/claude-skills-tutorial --skill fumadocs-i18n

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: fumadocs-i18n
Source: https://github.com/foreveryh/claude-skills-tutorial/tree/main/.claude/skills/fumadocs-i18n
Command: npx skills add https://github.com/foreveryh/claude-skills-tutorial --skill fumadocs-i18n

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Automates the complete setup of multi-language support for a Fumadocs project, enabling clean, scalable international documentation.

Core Features & Use Cases

Configure directory-based i18n routing with a default language and per-language content folders.
Add a language switcher to the UI and ensure language-specific sidebars.
Restructure the app layout to support [lang] routing and per-language docs, with content organized under content/docs/{lang}/.
Use-case: You are building a multilingual docs site and want consistent URLs like /en/docs and /zh/docs with isolated content trees.

Quick Start

Provide a new project with a fully localized docs site by applying this Skill:

Create lib/i18n.ts with parser: 'dir' and supported languages.
Implement middleware for locale routing.
Move app routes under [lang] and adjust layouts to use source.pageTree[lang].
Organize content under content/docs/{lang}/ and add per-language content.
Run build and test language switching and per-language routes.

Frequently Asked Questions about fumadocs-i18n

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I set up multilingual documentation routing in a Fumadocs project?▼

To set up multilingual documentation routing in Fumadocs, you configure directory-based i18n routing with a default language and per-language content folders. This involves creating lib/i18n.ts with parser 'dir' and applying middleware for locale routing.

How do I add a language switcher and language-specific sidebars in Fumadocs?▼

Adding a language switcher and language-specific sidebars in Fumadocs requires restructuring the app layout to support [lang] routing. You adjust layouts to use source.pageTree[lang] for filtering the DocsLayout tree per language.

How do I organize content directories for multiple languages in Next.js?▼

Organizing content directories for multiple languages in Next.js involves moving app routes under [lang] and placing content under content/docs/{lang}/. This isolates content trees to enable clean URLs like /en/docs and /zh/docs.

Does Fumadocs support isolated content trees for each language?▼

Yes, Fumadocs supports isolated content trees for each language by using directory-based i18n routing. Configuring the DocsLayout tree filtering and organizing content under content/docs/{lang}/ ensures language-specific sidebars and consistent localized URLs.

What is the best way to configure i18n middleware for Next.js documentation sites?▼

The best way to configure i18n middleware for Next.js documentation sites is by implementing locale routing alongside app/[lang] routing. This setup ensures correct language detection and content delivery for multilingual Fumadocs projects.

Can I use directory-based i18n routing without moving all my Next.js app routes?▼

No, directory-based i18n routing requires moving app routes under [lang]. Restructuring the app layout is necessary to support per-language docs and ensure the language switcher and sidebars function correctly across all routes.