ナビゲーションサイドバーの使い方

草案

このページは完成していません。

MDN の操作はよくサイドバーを用いて行われ、これは一連の記事や、同じ系列のドキュメントと MDN の他の領域の両方における関連コンテンツを列挙します。 MDN のサイドバーは自動的には生成されません。ページにサイドバーを入れるには、いくらかのマクロを作成し使用する必要があります。この記事では、 MDN サイドバーマクロの作成と記事内での使用方法の両方の手順を確認します。

現在の MDN のサイドバーマクロ

MDN には既に、サイドバーを生成するたくさんのマクロがあります。多くは MDN の特定のセクションに特化していますが、他に、特化したものがない文書領域のための一般的なサイドバーを生成するためのものがあります。

AddonSidebar: アドオンの文書を操作するためのサイドバーを挿入します。これは主にブラウザー拡張機能の作成についてのコンテンツです。
APIRef: API インターフェイスのリファレンスページおよびサブページで使用されるサイドバーを挿入します。
CanvasSidebar: HTML/DOM Canvas の文書の中で使用されるサイドバーを挿入します。
DefaultAPISidebar: 特化したサイドバーのタイプがない API の API 概要ページで使用することができる既定のサイドバーを挿入します。
FirefoxSidebar: Firefox に特化した文書で使用されるサイドバーを挿入します。
GamesSidebar: ウェブ技術を使ったゲーム開発に関する MDN のコンテンツを操作するサイドバーを挿入します。
HTMLSidebar: MDN の HTML 文書で使用されるサイドバーを挿入します。
HTTPSidebar: MDN の HTTP 文書内のページで使用するためのサイドバーを挿入します。
JSSidebar: JavaScript 文書で使用するためのサイドバーを挿入します。
LearnSidebar: 学習エリアのサイドバーを挿入します。
MDNSidebar: MDN の「メタ文書」、つまり、 MDN Web Docs サイト自体の利用や編集に関する文書を操作するサイドバーを挿入します。このページで実際にマクロが使われているのを見ることができます。
ServiceWorkerSidebar: サービスワーカーについての文書で使用されるサイドバーを挿入します。
SpiderMonkeySidebar: SpiderMonkey (Mozilla の JavaScript エンジン) のページに使用するサイドバーを挿入します。
ToolsSidebar: Firefox 開発ツールについてのページを列挙するサイドバーを挿入します。
WebAssemblySidebar: WebAssembly に関するリンクを含むサイドバーを挿入します。
WebExtAPISidebar: ブラウザー拡張 (WebExtension) についての API リファレンス文書を操作するために使われるサイドバーを挿入します。
WebGLSidebar: WebGL に関するコンテンツの操作を提供するサイドバーを挿入します。
WebRTCSidebar: MDN の WebRTC 文書の操作を提供するコンテンツのサイドバーを挿入します。
XSLTRef: XSLT, EXSLT, XPath についての文書のサイドバーを挿入します。

サイドバーの使用

サイドバーをページに追加するには、正しいマクロを探し、それから、サイドバーを挿入したいページで、「編集」ボタンをクリックしてください。ページに <p> ブロックを追加して、中身はマクロを呼ぶだけにしてください。そうすれば、マクロ呼び出しを追加することができます。通常、サイドバーマクロは引数を必要としませんので、単に次のように書くことができます。

<p>{{MDNSidebar}}</p>

通常は、これを文書の最初の行に入れてください。一部の文書では、代わりに末尾に入っています。これはうまく動作しますが、一貫性を保証するために、できれば先頭に配置してみてください。

すでにマクロを呼び出す <p> ブロックがページの先頭にある場合、例えばバナーを生成する {{Non-standard_Header}} などがある場合は、次のように同じ <p> の中にサイドバーのマクロを入れることができます。

<p>{{HTTPSidebar}}{{Non-standard_Header}}</p>

サイドバーの作成

詳細は執筆中

SidebarUtilities について触れておきます。

サイドバーの構築に役立つマクロがいくつかあります。

ListSubpagesForSidebar: 指定されたページのサブページを使用して、サイドバー内で利用するために構築されたリンクのツリーを生成します。