汎用ウェブサイトテンプレートセットのポイント
汎用ウェブサイトテンプレートセットは、Movable Type 4.2 より プロフェッショナル ウェブサイトテンプレートセット に名称変更しました。
汎用ウェブサイトテンプレートセットは、Movable Type を利用してウェブサイトを簡単に構築するための仕組みが整った便利なテンプレートセットで、Movable Type 4.1 から同梱されました。利用は簡単。テンプレートセット機能を利用して新しいブログの作成時、既存のブログにも適用することができます。
汎用ウェブサイトテンプレートセットではナビゲーションに項目を追加する仕組みに、作成するウェブページに設定するシークレットタグをうまく利用しています。
シークレットタグとは @ からはじまる名前で登録されるタグで、管理画面上では表示されますが MTTagName を利用したテンプレートでの出力はされないタグです。
汎用ウェブサイトテンプレートセットから、シークレットタグを利用して作成したウェブページを自動的にナビゲーションに追加する部分のテンプレートを抜きだして見てみましょう。
<mt:Pages tag="@topnav" sort_by="title" limit="3">
<MTSetVarBlock name="this_page_id"><$MTPageID$></MTSetVarBlock>
<li<mt:if name="nav_on" eq="$this_page_id"> class="on"></mt:if>><a href="<mt:PagePermalink />"><mt:PageTitle /></a></li>
</mt:Pages>
<mt:Pages tag="@topnav" sort_by="title" limit="3">
</mt:Pages>
MTPages ブロックタグでは tag モディファイアで、@topnav というシークレットタグが付けられたウェブページのみを表示するように設定されいており、あわせて sort_by モディファイアで並び順をタイトル順に並び替えしています。
また、limit モディファイアでは、@topnav というタグが設定されたウェブページをタイトル順に並び替えた結果から3件を出力するように設定しています。limit ディファイアの働きに関しては、lastn モディファイアと limit モディファイアの違いを参照ください。
この部分のテンプレートを少しづつ分解して解説します。
- 表示中のページのをわかりやすくするためにページの ID を変数に設定
-
<MTSetVarBlock name="this_page_id"><$MTPageID$></MTSetVarBlock>
MTSetVarBlockブロックタグで this_page_id という変数に出力するページの ID を設定し、ここで設定した値は、そのあとに続くテンプレートで nav_on という変数の値と比較されています。この nav_on という変数は、汎用ウェブページテンプレートセットの『ウェブページ』テンプレートの最初で設定されており、そのテンプレートで出力したウェブページの ID を変数の値として設定しています。<MTSetVarBlock name="nav_on"><$MTPageID$></MTSetVarBlock>
- ページの ID を比較して同じなら class="on" を追加
-
<li<mt:if name="nav_on" eq="$this_page_id"> class="on"></mt:if>>...</li>
ここでは前述のとおりナビゲーションに表示するウェブページの ID (変数 this_page_id に設定された値) と表示中のウェブページの ID (変数 nav_on に設定された値) が同じかどうか (
eq) の比較を行っています。もし、両者が同じ場合は、リスト要素 (li) に class="on" を追加し、CSS で表示中のページであることがわかるよう、スタイルが設定できるようになっています。
- ウェブページへのリンク
-
<a href="<mt:PagePermalink />"><mt:PageTitle /></a>
あとは、
MTPagePermalink,MTPageTitleファンクションタグで、該当ウェブページへのリンクを作成しています。
このように、汎用ウェブサイトテンプレートセットではシークレットタグをうまく利用して、簡単にナビゲーションに項目を追加する仕組みが備わっています。この方法は、ページ上部のナビゲーションだけではなく、フッタ部分にも活用されています。また、About ページや、お問い合わせページ、トップページに表示するコンテンツなども同様の仕組みが使われています。ウェブページをうまく活用する良い例になりそうです。ぜひ、テンプレートセットを切り替えて、オリジナルカスタマイズの参考にしてください。
