MovableType
パンくず

MovableTypeでパンくずのテンプレートモジュールを作成

MTを構築した際、全ページ共通で使えるパンくずのテンプレートモジュールを作成したので、作り方をメモしておきます。

前提

各ページにページIDを構造的に定義します。
こうすれば、例えばID01-で部分一致させれば、ID01-未満全て(ID01-01,ID01-02,ID01-01-01...)を絞ることができます。

パス ページID ページ内容
/ ID00 トップページ
/blog01/ ID01 ブログ01トップ
/blog02/ ID02 ブログ02トップ
/blog02/page01/ ID02-01 ブログ02ページ01
/blog02/page02/ ID02-02 ブログ02ページ02
/blog02/page02/sub01/ ID02-02-01 ブログ02ページ02の下位ページ01
/blog02/page02/sub02/ ID02-02-02 ブログ02ページ02の下位ページ02

ウェブページ

タイトルを以下のようにIDに[]をつけて設定する。
[ID02-01]ブログ02ページ01
HTMLに吐き出される際は[]は書き出さない。

IDの割り当て

各ブログでアーカイブテンプレートを作成するときに、タイトルをIDとタイトル文字に分けて、それぞれpage_titleとpage_idに格納。
page_idは後述の<$mt:Include parent="1" module="パンくず"$>で使用。

%b.html
<mt:SetVars>
  page_title=<$mt:PageTitle  regex_replace="/\[[\w-]+\]/","" $>
  page_id=<$mt:PageTitle regex_replace="/(\[|\].+)/g","" $>
</mt:SetVars>

<!DOCTYPE html>
<html lang="ja">
<head>
  <$mt:Include parent="1" module="HEAD"$>
  <title><mt:Var name="page_title"></title>
</head>
<body>
  <$mt:Include parent="1" module="ヘッダー"$>
  <$mt:Include parent="1" module="パンくず"$>
  <$mt:PageBody$>
  <$mt:Include parent="1" module="フッター"$>
</body>
</html>

パンくず

ウェブサイトトップ -> デザイン -> テンプレート -> モジュールからパンくずを作成する。

表示サンプル

自分の階層以上の階層にリンクが貼られます。

第2階層のページでの表示

TOP > ブログ02トップ

第3階層のページでの表示

TOP > ブログ02トップ > ブログ02ページ02

第4階層のページでの表示

TOP > ブログ02トップ > ブログ02ページ02 > ブログ02ページ02の下位ページ02

パンくず.module
<mt:Ignore>########### 第2階層名 ###########</mt:Ignore>
<mt:If name="page_id" like="ID01-">
<$mt:SetVar name="bread_level_2" value="ブログ01"$>
<$mt:SetVar name="bread_level_2_dir" value="blog01"$>

<mt:ElseIf like="ID02-">
<$mt:SetVar name="bread_level_2" value="ブログ02"$>
<$mt:SetVar name="bread_level_2_dir" value="blog02"$>
...
</mt:If>

<mt:Ignore>########### 第3階層名 ###########</mt:Ignore>
<mt:If name="page_id" like="ID02-01-">
<$mt:SetVar name="bread_level_3" value="ブログ02ページ01"$>
<$mt:SetVar name="bread_level_3_dir" value="blog0201"$>

<mt:ElseIf like="ID02-02-">
<$mt:SetVar name="bread_level_3" value="ブログ02ページ02"$>
<$mt:SetVar name="bread_level_3_dir" value="blog0202"$
...
</mt:If>

<mt:Ignore>########### 出力部分 ###########</mt:Ignore>
<nav>
  <ul>
    <li><a href="/">TOP</a></li>

    <mt:If name="bread_level_2" ne="">
    <li><a href="/<mt:Var name="bread_level_2_dir">/"><mt:Var name="bread_level_2"></a></li>
    </mt:If>

    <mt:If name="bread_level_3" ne="">
    <li><a href="/<mt:Var name="bread_level_2_dir">/<mt:Var name="bread_level_3_dir">/"><mt:Var name="bread_level_3"></a></li>
    </mt:If>  
    <li><mt:Var name="page_title"></li>
  </ul>
</nav>

詳細

<mt:If name="page_id" like="ID01-">

page_idにID01-が含まれている場合の表示を設定します。
(例えばID01-01、ID01-01-01などID01を含まないID01以下のページです)

<$mt:SetVar name="bread_level_2" value="ブログ01"$>
<$mt:SetVar name="bread_level_2_dir" value="blog01"$>

bread_level_2のvalueには第2階層表示名、bread_level_2_dirのvalueには第2階層ディレクトリを設定します。

<mt:If name="bread_level_2" ne="">

第3階層以下のページで表示されます。bread_level_2が設定されていない場合は表示されません。

以上。