Headings

Remark HeadingCopy Anchor Link

A remark plugin that applies ids to headings. Fumadocs MDX enables it by default. Pass options with remarkHeadingOptions.

Custom IdsCopy Anchor Link

You can customize the heading id with [#slug].

# heading [#slug]

To disable it:

import { defineConfig } from 'fumadocs-mdx/config';

export default defineConfig({
  mdxOptions: {
    remarkHeadingOptions: {
      customId: false,
    },
  },
});

Extract TOCCopy Anchor Link

By default, it also extracts the headings (table of contents) of a document to the file data as toc, an array of TOCItemType. Fumadocs MDX turns it off with generateToc: false and exports the table of contents with Rehype TOC instead.

Rehype TOCCopy Anchor Link

A rehype plugin that exports the table of contents (an array of TOCItemType). Unlike Remark Heading, it keeps JSX nodes in heading titles.

Fumadocs MDX enables it by default. On Sätteri, pass options with rehypeTocOptions.

OutputCopy Anchor Link

For a Markdown document:

## Hello `code`

An export will be created:

export const toc = [
  {
    title: (
      <>
        Hello <code>code</code>
      </>
    ),
    depth: 2,
    url: '#hello-code',
  },
];