使用例

ここでは、TreeOrder のタグを組み合わせた代表的な実装例を紹介します。いずれもウェブページ（page）を例にしていますが、class を変えれば記事やコンテンツデータでも同様に使えます。

ナビゲーションメニュー（ネスト対応）

ルート（一番上の階層）のページを一覧し、子ページがあれば入れ子のリストとして出力します。mt:TreeOrderIsFirst / mt:TreeOrderIsLast で、リスト全体を囲む <ul> を 1 度だけ出力しています。

<nav>
<mt:TreeOrder class="page" top_level_only="1">
  <mt:TreeOrderIsFirst><ul></mt:TreeOrderIsFirst>
  <li>
    <a href="<mt:PagePermalink>"><mt:PageTitle></a>
    <mt:TreeOrderHasChildren>
      <ul>
      <mt:TreeOrderChildren>
        <li><a href="<mt:PagePermalink>"><mt:PageTitle></a></li>
      </mt:TreeOrderChildren>
      </ul>
    </mt:TreeOrderHasChildren>
  </li>
  <mt:TreeOrderIsLast></ul></mt:TreeOrderIsLast>
</mt:TreeOrder>
</nav>

パンくずリスト

現在のページに親がある場合だけ、ルートからの祖先をたどってパンくずを出力します。最後に現在のページ自身を表示しています。

<mt:TreeOrder class="page">
  <mt:TreeOrderHasParent>
    <nav aria-label="breadcrumb">
      <ol>
        <mt:TreeOrderAncestors>
          <li><a href="<mt:PagePermalink>"><mt:PageTitle></a></li>
        </mt:TreeOrderAncestors>
        <li aria-current="page"><mt:PageTitle></li>
      </ol>
    </nav>
  </mt:TreeOrderHasParent>
</mt:TreeOrder>