6.19 サブカテゴリリストを定義型リストでマークアップする

P.475

順不同リストによるマークアップとの違い

順不同リストによるマークアップ

<ul>
  <li>親カテゴリーA
    <ul>
      <li>子カテゴリーA-1</li>
      <li>子カテゴリーA-2</li>
      <li>子カテゴリーA-3</li>
    </ul>
  </li>
</ul>
<ul>
  <li>親カテゴリーB
    <ul>
      <li>子カテゴリーB-1</li>
      <li>子カテゴリーB-2</li>
      <li>子カテゴリーB-3</li>
    </ul>
  </li>
</ul>

定義型リストによるマークアップ

<dl>
  <dt>親カテゴリーA</dt>
  <dd>
    <ul>
      <li>子カテゴリーA-1</li>
      <li>子カテゴリーA-2</li>
      <li>子カテゴリーA-3</li>
    </ul>
  </dd>
  <dt>親カテゴリーB</dt>
  <dd>
    <ul>
      <li>子カテゴリーB-1</li>
      <li>子カテゴリーB-2</li>
      <li>子カテゴリーB-3</li>
    </ul>
  </dd>
</dl>

P.476

カスタマイズ

「カテゴリアーカイブ」ウィジェットテンプレート)

<mt:ifArchiveTypeEnabled archive_type="Category">
<mt:if tag="blogCategoryCount">
<dt class="sidetitle">カテゴリ一覧</dt>
<dd class="side">
<mt:topLevelCategories>
  <mt:subCatIsFirst>
    <mt:hasNoParentCategory>
<dl>
    <mt:else>
  <dd>
     <ul>
    </mt:hasNoParentCategory>
  </mt:subCatIsFirst>
  <mt:if tag="categoryCount">
    <mt:hasNoParentCategory>
  <dt><a href="<mt:categoryArchiveLink />" title="<mt:categoryDescription />"><mt:categoryLabel></a> [<mt:categoryCount />]</dt>
    <mt:else>
      <li><a href="<mt:categoryArchiveLink />" title="<mt:categoryDescription />"><mt:categoryLabel></a> [<mt:categoryCount />]</li>
    </mt:hasNoParentCategory>
  <mt:else>
    <mt:hasNoParentCategory>
  <dt><mt:categoryLabel></dt>
    <mt:else>
      <li><mt:categoryLabel></li>
    </mt:hasNoParentCategory>
  </mt:if>
  <mt:subCatsRecurse />
  <mt:subCatIsLast>
    <mt:hasParentCategory>
    </ul>
  </dd>
    <mt:else>
</dl>
    </mt:hasParentCategory>
  </mt:subCatIsLast>
</mt:topLevelCategories>
</dd>
</mt:if>
</mt:ifArchiveTypeEnabled>

P.477

「スタイルシート」インデックステンプレート

...前略...
#sub1 .side dt,
#sub2 .side dt {
    margin-left: -15px;
}
#sub1 .side dd,
#sub2 .side dd {
    font-size: 100%;
}
...後略...

ウェブページ

Powered by Movable Type 4.261

このアーカイブについて

最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。