2007年10月12日
サイドメニューの折りたたみ(定義リスト編)
当サイトで公開している「サイドメニューの折りたたみ」について、配布テンプレート(XHTML 1.0 Strict 版)のサイドバーに定義リスト(dl/dt/dd)を使用している場合のカスタマイズについてご質問を頂きましたので、本エントリーにて説明致します。
div 要素の場合の設定例
これまでの、div を使用した場合の設定(青色部分を追加)は下記の通りです。
<div class="sidetitle" id="categoryname">
Categories
</div>
<div class="side" id="categorylist">
<MTCategories>
<a href="<$MTCategoryArchiveLink$>">
<$MTCategoryLabel$></a> [<$MTCategoryCount$>]<br />
</MTCategories>
</div>
<script type="text/javascript">
<!--
FoldNavigation('category','on',true);
//-->
</script>
MT4(またはMT3.x XHTML1.0 Strict 版)の設定例
カテゴリーリスト
ここではカテゴリーリストを例に挙げてますが、どのリストについても、script 要素を dd 要素で括ってください。これを行わないと valid な XHTML になりません。
また、script 要素はリストに示す通り、MTIfArchiveTypeEnabled の内側に設定してください。外側でも問題ありませんが、内側の方がより妥当です。
<MTIf name="module_category_archives">
<MTIfArchiveTypeEnabled archive_type="Category">
<dt class="sidetitle" id="categoryname">
Categories
</dt>
<dd class="side" id="categorylist">
<div id="categories">
<MTTopLevelCategories>
<MTSubCatIsFirst><ul></MTSubCatIsFirst>
<MTIfNonZero tag="MTCategoryCount">
<li><a href="<$MTCategoryArchiveLink$>" title="<$MTCategoryDescription$>"><MTCategoryLabel></a> [<$MTCategoryCount$>]
<MTElse>
<li><MTCategoryLabel>
</MTElse>
</MTIfNonZero>
<MTSubCatsRecurse max_depth="3">
</li>
<MTSubCatIsLast></ul></MTSubCatIsLast>
</MTTopLevelCategories>
</div>
</dd>
<dd>
<script type="text/javascript">
<!--
FoldNavigation('category','on',true);
//-->
</script>
</dd>
</MTIfArchiveTypeEnabled>
</MTIf>
アーカイブリスト
デフォルトテンプレートのサイドバーにあるアーカイブリストの構造(+定義リスト)を適用している場合、script 要素を dd 要素で括ることに加え、各アーカイブリスト(月別アーカイブリスト・月別カテゴリアーカイブリスト・ユーザーアーカイブリスト・月別ユーザーアーカイブリスト)の id 属性はすべて同じものを使用して構いません。これは各アーカイブ(またはメインページ)で表示されるリストがいずれかひとつであるためです。
<MTIf name="module_monthly_archives">
<MTIfArchiveTypeEnabled archive_type="Monthly">
<dt class="sidetitle" id="archivename">
Monthly Archives
</dt>
<dd class="side" id="archivelist">
<ul>
<MTArchiveList archive_type="Monthly">
<li><a href="<$MTArchiveLink$>"><$MTArchiveTitle$></a> [<$MTArchiveCount$>]</li>
</MTArchiveList>
</ul>
</dd>
<dd>
<script type="text/javascript">
<!--
FoldNavigation('archive','on',true);
//-->
</script>
</dd>
</MTIfArchiveTypeEnabled>
</MTIf>
<MTIf name="module_category-monthly_archives">
<MTIfArchiveTypeEnabled archive_type="Category-Monthly">
<dt class="sidetitle" id="archivename"><$MTArchiveTitle$>: Monthly Archives</dt>
<dd class="side" id="archivelist">
<MTArchiveList archive_type="Category-Monthly">
<MTArchiveListHeader>
<ul>
</MTArchiveListHeader>
<li><a href="<$MTArchiveLink$>"><$MTArchiveTitle$> (<$MTArchiveCount$>)</a></li>
<MTArchiveListFooter>
</ul>
</MTArchiveListFooter>
</MTArchiveList>
</dd>
<dd>
<script type="text/javascript">
<!--
FoldNavigation('archive','on',true);
//-->
</script>
</dd>
</MTIfArchiveTypeEnabled>
</MTIf>
<MTIf name="module_author-monthly_archives">
<MTIfArchiveTypeEnabled archive_type="Author-Monthly">
<dt class="sidetitle" id="archivename"><$MTAuthorDisplayName$>: Monthly Archives</dt>
<dd class="side" id="archivelist">
<MTArchiveList archive_type="Author-Monthly">
<MTArchiveListHeader>
<ul>
</MTArchiveListHeader>
<li><a href="<$MTArchiveLink$>"><$MTArchiveTitle$> (<$MTArchiveCount$>)</a></li>
<MTArchiveListFooter>
</ul>
</MTArchiveListFooter>
</MTArchiveList>
</dd>
<dd>
<script type="text/javascript">
<!--
FoldNavigation('archive','on',true);
//-->
</script>
</dd>
</MTIfArchiveTypeEnabled>
</MTIf>
<MTIf name="module_author_archives">
<MTIfArchiveTypeEnabled archive_type="Author">
<dt class="sidetitle" id="archivename">Author Archives</dt>
<dd class="side" id="archivelist">
<MTArchiveList archive_type="Author">
<MTArchiveListHeader>
<ul>
</MTArchiveListHeader>
<li><a href="<$MTArchiveLink$>"><$MTArchiveTitle$> (<$MTArchiveCount$>)</a></li>
<MTArchiveListFooter>
</ul>
</MTArchiveListFooter>
</MTArchiveList>
</dd>
<dd>
<script type="text/javascript">
<!--
FoldNavigation('archive','on',true);
//-->
</script>
</dd>
</MTIfArchiveTypeEnabled>
</MTIf>
上記の例では script 要素がやや冗長なので、リストの一番最後(MTIf の外側)にひとつだけ設置しても良いでしょう。
その場合、何らかのページでアーカイブリストがひとつも表示されなくても、JavaScript エラーは出ないはずです。
Comments [6]
| Trackbacks [0]