Fumadocs
Layouts

Home Layout

Shared layout for other pages

Usage

Add a navbar and search dialog across other pages.

/app/(home)/layout.tsx
import { HomeLayout } from 'fumadocs-ui/layouts/home';
import { baseOptions } from '@/app/layout.config';
import type { ReactNode } from 'react';
 
export default function Layout({ children }: { children: ReactNode }) {
  return <HomeLayout {...baseOptions}>{children}</HomeLayout>;
}

Create a Route Group to share the same layout across multiple pages.

page.tsx
layout.tsx

How is this guide?

Edit on GitHub

Docs Layout

The layout of documentation

Notebook

A more compact version of Docs Layout

On this page