Heading Links
h2 以上の見出しにスラグベースの id 属性と自己参照アンカーリンクを追加します。
Core 機能 — 常に有効です。アンカー ID の 方式 は設定可能です(後述)。
概要
h2 以上のすべての見出しに以下が自動的に付与されます。
zfb 独自の
slugifyで見出しテキストから生成されたスラグベースのid属性(github-slugger に近い挙動ですが、.や/などの記号を除去せず-にまとめます)。見出しテキストをラップする自己参照アンカー要素。読者がページ内の直接リンクをコピーできます。
重複解消: 同じスラグが複数生成される場合、カウンターサフィックスが付与されます(
overview、overview-1、overview-2など)。
h1 には id が付与されません。ドキュメント唯一の h1 はフロントマターのページタイトルです。
ID 方式
id の生成方式は zfb.config.ts の markdown.features.headingIds.strategy で選択します。zudo-doc ではこれを単一の設定 src/ の headingIdStrategy に紐付けており、レンダリングされる ID と右側 TOC のアンカーが 1 つの設定値で駆動されます。
// zfb.config.ts
markdown: {
features: {
headingIds: { strategy: settings.headingIdStrategy }, // "flat" | "hierarchical"
},
}flat
h2–h6 全体で 1 つの重複カウンターを共有するスラグ方式(overview、overview-1 など)。スラグは npm の github-slugger ではなく zfb 独自の slugify で生成されます。zfb のデフォルトです。
hierarchical(このサイトで使用)
各見出しの id は、祖先の連なりを - で結合したプレフィックスを持ちます。
## Foo
### Moo
#### Mewは id="foo"、id="foo-moo"、id="foo-moo-mew" としてレンダリングされます(フラットな foo、moo、mew ではなく)。見出し内アンカーの href、右側 TOC、Heading Marker TOC、TOC export はすべて同じ ID に従います。
詳細:
完全パスが重複した場合は重複カウンターが付与されます(
a-b、a-b-1)。重複解消された親はその 最終 ID を子に与えます。2 つ目の
## Fooはfoo-1となり、その配下の### Barはfoo-1-barになります。階層アンカーは見出しのアウトラインから再構築でき、フラットなスラグより衝突がはるかに少なくなります(URL が長くなる代わりに)。
アンカーが変わります
他のページからのディープリンク
各見出しに安定した id が付与されるため、別のページの特定セクションにリンクできます。hierarchical 方式では、ネストした見出しには祖先プレフィックス付きの形式を使います。
[Moo セクションを参照](./other-page.mdx#foo-moo)補足
zudo-doc の右側 TOC ビルダー(
pages/)も同じ方式をミラーしているため、TOC のlib/ _ extract- headings. ts href="#…"値は常にレンダリングされた見出しidと一致します。オプトインの Heading Marker TOC 機能は、このプラグインが生成した安定した見出し識別子に依存します。
headingMarkerTocが有効な場合、Heading Links の後で実行されます。