6.20 カテゴリアーカイブページのデザインをカテゴリ別に切り替える
P.479
●カテゴリアーカイブテンプレートの作成
テンプレート名:カテゴリアーカイブ
テンプレートの内容:次の内容を設定
<mt:categoryDescription setvar="category_description" />
<mt:if name="category_description">
<mt:include module="$category_description"$>
<mt:else>
<mt:include module="デフォルトカテゴリ"$>
</mt:if>
P.480
●「お知らせ」カテゴリ用テンプレートモジュールの作成
テンプレート名:お知らせカテゴリ
テンプレートの内容:次の内容を設定
<mt:setVars>
title=<mt:archiveTitle /> - <mt:archiveTypeLabel />アーカイブ
page_layout=layout-two-column-right
</mt:setVars>
<mt:include module="ヘッダー" />
<div id="contents" class="clearfix">
<div id="main">
<div class="content-nav">
<mt:archivePrevious>
<a href="<mt:archiveLink />">« <mt:archiveTitle /></a> |
</mt:archivePrevious>
<a href="<mt:link template="main_index" />">メインページ</a> |
<a href="<mt:link template="archive_index" />">アーカイブ</a>
<mt:archiveNext>
| <a href="<mt:archiveLink />"><mt:archiveTitle /> »</a>
</mt:archiveNext>
</div>
<p class="content-header"><mt:archiveTypeLabel />アーカイブ - <mt:archiveTitle /></p>
<mt:if name="datebased_archive">
<mt:entries>
<mt:entryTrackbackData />
<mt:include module="ブログ記事の概要" />
</mt:entries>
<mt:else>
<mt:entries limit="auto">
<mt:entryTrackbackData />
<mt:include module="ブログ記事の概要" />
</mt:entries>
</mt:if>
</div>
<div id="sub1">
<mt:include module="サイドバー左" />
<mt:include module="サイドバー右" />
</div>
</div>
<mt:include module="フッター" />
P.481
<body class="layout-two-column-right" />
●「イベント」カテゴリ用テンプレートモジュールの作成
テンプレート名:イベントカテゴリ
テンプレートの内容:「お知らせカテゴリ」テンプレートの内容を設定して、003のみ、次の内容に変更
<mt:setVars>
title=<mt:archiveTitle /> - <mt:archiveTypeLabel />アーカイブ
page_layout=layout-two-column-left
</mt:setVars>
...後略...
<body class="layout-two-column-left" />
P.482
●CSSの設定
「スタイルシート」インデックステンプレート
...前略...
body.layout-two-column-right #header,
body.layout-two-column-right #contents {
width: 700px;
}
body.layout-two-column-right #main {
width: 500px;
}
body.layout-two-column-left #header,
body.layout-two-column-left #contents {
width: 700px;
}
body.layout-two-column-left #main {
width: 500px;
}
body.layout-two-column-left #sub1 dl,
body.layout-two-column-left #sub2 dl {
padding-left: 0;
padding-right: 20px;
}
body.layout-two-column-left #main {
float: right;
}
/* フッター */
#footer {
height: 50px;
background: url(<mt:staticWebPath />plugins/SampleTemplateSet/images/footer_back.png) repeat-x;
font-size: 75%;
text-align: center;
line-height: 3.7;
}
...後略...
特定のカテゴリ用のCSSを呼び出す
カテゴリ専用のテンプレートモジュール
<mt:setVars>
title=<mt:archiveTitle /> - <mt:archiveTypeLabel />アーカイブ
page_layout=<mt:categoryDescription />
</mt:setVars>
<mt:setVarBlock name="html_head">
<link rel="stylesheet" href="<mt:blogURL />cat_<mt:categoryID />.css" type="text/css" media="screen,tv" />
</mt:setVarBlock>
...後略...
<body class="products">
P.483
<link rel="stylesheet" href="http://user-domain/cat_3.css" type="text/css" media="screen,tv" />
body.products #contents { ... }
body.products #main { ... }
その他の方法でカテゴリのデザインを切り替える
●カテゴリ名で切り替える
テンプレート名:カテゴリアーカイブ
テンプレートの内容:次の内容を設定
<mt:categoryLabel setvar="category_label" />
<mt:include module="$category_label"$>
P.484
●カスタムフィールドで切り替える
「カテゴリ」アーカイブテンプレート
<mt:categoryIncludeName setvar="category_include_name" />
<mt:if name="category_include_name">
<mt:include module="$category_include_name"$>
<mt:else>
<mt:include module="デフォルトカテゴリ"$>
</mt:if>
その他のカテゴリ判定方法
●デフォルトカテゴリがない場合
「カテゴリ」アーカイブテンプレート
<mt:ifCategory name="デザイン">
<mt:include module="デザインカテゴリ" />
</mt:ifCategory>
<mt:ifCategory name="お知らせ">
<mt:include module="お知らせカテゴリ" />
</mt:ifCategory>
●デフォルトカテゴリがある場合
「カテゴリ」アーカイブテンプレート
<mt:ifCategory name="デザイン">
<mt:include module="デザインカテゴリ" />
<mt:else>
<mt:ifCategory name="お知らせ">
<mt:include module="お知らせカテゴリ" />
<mt:else>
<mt:include module="デフォルトカテゴリ" />
</mt:ifCategory>
</mt:ifCategory>
P.485
注意事項
「イベント」カテゴリ用ブログ記事リスト
<mt:ifCategory name="デザイン">
<mt:include module="デザインカテゴリ" />
</mt:ifCategory>
「お知らせ」カテゴリ用ブログ記事リスト
<mt:ifCategory name="お知らせ">
<mt:include module="お知らせカテゴリ" />
</mt:ifCategory>