【Movable Type】テンプレートの種類や特定のページで出力する内容を変更する方法

Posted on 2021-05-30

サイトを構築しているとテンプレートの種類や特定のページで出力する内容を変更したいことがあると思います。例えば全ページ共通で使用しているモジュールでテンプレートやページによってタイトルタグやCSSを出し分けたい場合などです。

テンプレートの種類による出し分け

テンプレートの種類によって出力する内容を変えたい場合は予め用意されている予約変数を利用します。
予約変数とはテンプレートの種類や出力するアーカイブの種類にあわせて自動で設定されている変数のことで以下のようなものです。

テンプレートの種類	予約変数
メインページ	main_index
ウェブページ	page_archive
記事	entry_archive
カテゴリ別記事リスト	category_archive

これは良く使う一部の例で他にも用意されいているので詳しくは公式のリファレンスを参照ください。

例えばCSSをテンプレートの種類によって変更したい場合は以下のように記述します。

<mt:IfWebsite><mt:Ignore> ===== 親サイト ===== </mt:Ignore>
  <mt:If name="main_index"><mt:Ignore> ===== 親サイトのメインページ ===== </mt:Ignore>
    <link rel="stylesheet" href="/css/parent_index.css">
  <mt:Elseif name="page_archive"><mt:Ignore> ===== 親サイトのウェブページ ===== </mt:Ignore>
    <link rel="stylesheet" href="/css/parent_page.css">
  <mt:Elseif name="entry_archive"><mt:Ignore> ===== 親サイトの記事 ===== </mt:Ignore>
    <link rel="stylesheet" href="/css/parent_entry.css">
  <mt:Elseif name="category_archive"><mt:Ignore> ===== 親サイトのカテゴリアーカイブ ===== </mt:Ignore>
    <link rel="stylesheet" href="/css/parent_category.css">
  <mt:Else><mt:Ignore> ===== 親サイトの上記以外のテンプレート ===== </mt:Ignore>
    <link rel="stylesheet" href="/css/parent_other.css">
  </mt:If>
<mt:Else><mt:Ignore> ===== 子サイト ===== </mt:Ignore>
  <mt:If name="main_index"><mt:Ignore> ===== 子サイトのメインページ ===== </mt:Ignore>
    <link rel="stylesheet" href="/css/child_index.css">
  <mt:Elseif name="page_archive"><mt:Ignore> ===== 子サイトのウェブページ ===== </mt:Ignore>
    <link rel="stylesheet" href="/css/child_page.css">
  <mt:Elseif name="entry_archive"><mt:Ignore> ===== 子サイトの記事 ===== </mt:Ignore>
    <link rel="stylesheet" href="/css/child_entry.css">
  <mt:Elseif name="category_archive"><mt:Ignore> ===== 子サイトのカテゴリアーカイブ ===== </mt:Ignore>
    <link rel="stylesheet" href="/css/child_category.css">
  <mt:Else><mt:Ignore> ===== 子サイトの上記以外のテンプレート ===== </mt:Ignore>
    <link rel="stylesheet" href="/css/child_other.css">
  </mt:If>
</mt:IfWebsite>

まずは<mt:IfWebsite>で親サイトと子サイトを分岐します。
その後、<mt:If>でメインページであれば name=”main_index”、ウェブページであれば name=”page_archive”というように予約変数を利用して分岐し、テンプレートごとの内容を記述します。

特定のページの場合

テンプレートではなく特定のウェブページ、記事、カテゴリなどで出力する内容を変更したい場合は該当するIDに対して以下のように分岐することができます。

IDではなくタイトルでも分岐できますが、運用の中でタイトルは変わる可能性があり、そのたびにテンプレートを修正するのは手間なのでここではページのIDで分岐しています。ただし開発環境と本番環境でIDが異なる場合は注意が必要です。

IDは該当するページの編集画面を開くとURLに「id=◯◯」という文字列が含まれていますのでそこから調べることができます。

特定のウェブページの場合

<mt:If tag="PageID" eq="ページのID">
  <link rel="stylesheet" href="/css/page_01.css">
</mt:If>

特定の記事の場合

<mt:If tag="EntryID" eq="記事のID">
  <link rel="stylesheet" href="/css/entry_01.css">
</mt:If>

特定のカテゴリの場合

<mt:If tag="CategoryID" eq="カテゴリのID">
  <link rel="stylesheet" href="/css/category_01.css">
</mt:If>

特定のサイトの場合

<mt:If tag="BlogID" eq="サイトのID">
  <link rel="stylesheet" href="/css/site_01.css">
</mt:If>

複数のIDを指定する場合

複数のIDを指定する場合は以下のように正規表現を用いてIDを指定します。

<mt:If tag="PageID" like="^(ページのID|ページのID)$">
  <link rel="stylesheet" href="/css/page_02.css">
</mt:If>

理由については「MTIfでlikeを使用して複数の条件を指定する場合の注意点」を参照ください。

おしまい。

Movable Type