チャレンジ! Movable TypeをCMSとして使ってみよう!

第12回 個別のブログ記事とウェブページのテンプレート完成させる

この記事を読むのに必要な時間:およそ 3 分

ウェブページテンプレートを完成させる

くれま先輩:ではでは,次に行きましょ!次はウェブページテンプレートね。上部メニューバーの「デザイン→テンプレート」をクリックして,一覧の「アーカイブテンプレート」のセクションにある「ウェブページ」をクリックしてね。

ほげ山くん:はい,ウェブページテンプレートの編集画面になりました。

くれま先輩:この連載のこれまでの作業で大枠はできてるから,次に言うコードを入れていってね。1個目は,<div id="primary">の中にパンくずナビゲーションを読み込んでいる<mt:Include module="パンくずナビゲーション" />が書いてあると思うから,そのすぐ後にこう書いて。

<mt:Include module="パンくずナビゲーション" />の直後に書くMTタグ

<h1><mt:PageTitle /></h1>
<mt:PageBody />

ほげ山くん:書きましたー。

くれま先輩:ウェブページではとくに変わったことはしないで,素直にページのタイトルと本文を出力させているだけだよ。mt:PageTitleはウェブページのタイトルを表示するタグ,mt:PageBodyはウェブページの本文を出力するタグで,それぞれmt:EntryTitle,mt:EntryBodyと働きは同じイメージなの。

ほげ山くん:PageとEntryが違うだけで,ほとんどそっくりですものね。

くれま先輩:他にもウェブページで使うMTタグには,ブログ記事で使うものと兄弟的なものが多いので,ほとんど迷わずに使えると思うよ!じゃあ,次は,<div id="secondry">の中に,こんな風に書いてね。

<div id="secondry">の中に書くサブテンプレート

<mt:WidgetManager name="バナー" />
<mt:TopLevelCategories sort_method="SortCatFld::Sort">
<mt:SubCatIsFirst>
<ul>
</mt:SubCatIsFirst>
<li><a href="<mt:CategoryArchiveLink />"><mt:CategoryLabel /></a>
<mt:SubCatsRecurse />
</li>
<mt:SubCatIsLast>
</ul>
</mt:SubCatIsLast>
</mt:TopLevelCategories>

ほげ山くん:これって,第10回で書いたブログ記事リストテンプレートの<div id="secondry">の中身と一緒ですね。

くれま先輩:そうなの。このサイトの中の「カテゴリ」で作ったものを,一覧表示させているんだよ。

ほげ山くん:ウェブページのテンプレートは,これで終わりですか?

くれま先輩:うん。さっくりだったねw 次回はいよいよ,検索用テンプレートを作っていこうね!

次回予告

  • 検索用テンプレートに着手する。

著者プロフィール

黒野明子(くろのあきこ)

1973年生まれ。1995年 武蔵野美術大学短期大学部専攻科グラフィックデザインコース修了。

ファッションカメラマン事務所、広告系デザイン事務所、Web制作会社勤務を経て、2003年よりフリー。Webデザイン・企画を中心に、DTPデザインなども行う。

現在、武蔵野美術大学共通デザイン研究室非常勤講師及び株式会社デジタルスケープ・PreJOBトレーニング講師も兼務。2005年秋頃から業務としてMTサイトの構築を始め、現在の業務のほとんどでMovable Typeを使用している。

著書:

『CMSとして使うMovable Typeガイドブック』 (翔泳社、共著)

『Movable Typeプロフェッショナル・スタイル』(毎日コミュニケーションズ、共著)

URL:http://cremadesign.jp/