カテゴリ一覧のアコーディオン表示(解説その1)

昨日、カテゴリ一覧のアコーディオン表示を行う方法を紹介しました。
その中で紹介したテンプレートについて、順を追って解説します。

1.トップレベルカテゴリとそれ以外のカテゴリとの区別

今回の問題では、以下のように出力を行う必要があります。

• トップレベルカテゴリはh2要素でマークアップ
• それ以外のカテゴリはul／li要素でマークアップ

これを実現するためには、トップレベルカテゴリとその他のカテゴリを区別する必要があります。

この処理は、「MTHasParentCategory」か「MTHasNoParentCategory」というタグで行うことができます。
MTHasParentCategoryタグは、親カテゴリがある（＝トップレベルカテゴリでない）かどうかを判断する際に使います。
一方、MTHasNoParentCategoryタグは、親カテゴリがない（＝トップレベルカテゴリである）かどうかを判断する際に使います。
また、MTHasParentCategoryタグ／MTHasNoParentCategoryタグともに、MTElseタグを組み合わせて書くこともできます。

ここまでの話に沿って、トップレベル／それ以外のカテゴリの名前を出力する部分を組むと、以下のように書くことができます。

<mt:TopLevelCategories>
・
・
・
<mt:HasParentCategory>
  <h2><a href="<$mt:CategoryArchiveLink$>"><$mt:CategoryLabel$></a></h2>
<mt:Else>
  <li><a href="<$mt:CategoryArchiveLink$>"><$mt:CategoryLabel$></a></li>
</mt:HasParentCategory>
・
・
・
</mt:TopLevelCategories>

2.サブカテゴリの出力

MTTopLevelCategoriesタグのブロックの中で、現在出力中のカテゴリから階層を1つ下って、サブカテゴリの一覧を出力するには、「MTSubCatsRecurse」というテンプレートタグを使います。

今取り上げている例だと、トップレベルカテゴリのサブカテゴリを出力する場合と、サブカテゴリからさらにサブカテゴリに下る場合とで、マークアップが以下のように異なります。

・トップレベルカテゴリのサブカテゴリを出力する場合

<h2>カテゴリ名</h2>
サブカテゴリの一覧の出力

・サブカテゴリからさらにサブカテゴリに下る場合

<li>カテゴリ名
サブカテゴリの一覧の出力
</li>

上記の「サブカテゴリの一覧の出力」の箇所を、MTSubCatsRecurseタグに置き換えます。
また、サブカテゴリからさらにサブカテゴリに下る場合（＝現在出力中のカテゴリがトップレベルカテゴリでない場合）は、サブカテゴリ一覧を出力した後に、</li>タグを出力する必要があります。

ここまでの話から、実際にテンプレートを書くと、以下のようになります。

<mt:TopLevelCategories>
・
・
・
<mt:HasParentCategory>
  <li><a href="<$mt:CategoryArchiveLink$>"><$mt:CategoryLabel$></a>
<mt:Else>
  <h2><a href="<$mt:CategoryArchiveLink$>"><$mt:CategoryLabel$></a></h2>
</mt:HasParentCategory>
<$mt:SubCatsRecurse$>
<mt:HasParentCategory>
  </li>
</mt:HasParentCategory>
・
・
・
</mt:TopLevelCategories>