📃

【Movable Type】カレンダー機能を利用する

2025/02/05に公開

概要

MTにはひと月分のカレンダーを表示する機能が実装されています。
本記事では、このカレンダー機能を利用して「イベントカレンダー」を作成する方法を解説しています。

カレンダーを出力するためのブロックタグは2種類あります。記事の場合もコンテンツタイプの場合もタグが違うのみで、コードの構成は同じです。なお、MTCalendarはPowerCMSにおいても実装可能です。

  • MTCalendar(記事)
  • MTContentCalendar(コンテンツタイプ)

以降のサンプルで使用するコンテンツタイプの設定は以下です。

  • コンテンツタイプ名:イベントカレンダー(ID: 4)
  • コンテンツフィールド
    • イベント名(テキスト / 入力必須)
    • イベントカテゴリ(カテゴリ / 入力必須)

カレンダー上には「イベント名」と「イベントカテゴリ」のみ表示させ、各コンテンツデータの詳細ページへリンクさせる想定です。実際に作成する際は、必要に応じて詳細ページに表示する項目とフィールドを追加してください。

コード例

MTのカレンダー機能には、前後月へのリンクを生成するタグがありません。
前後月のリンクをつける場合は、コンテンツタイプリストアーカイブテンプレートの「月別」アーカイブマッピングを利用し、MTArchiveLinkで前後月のリンクを出力します。

以下のコード例は縦型カレンダーの出力例です。1行が7日ずつの表組カレンダーのコードは、公式リファレンスのコード例をご確認ください。

<!-- MTML -->
<mt:ArchiveDate format="%Y%m" setvar="catendarMonth">

<h1><$mt:ArchiveDate format="%Y年%b月"$>のイベントカレンダー</h1>
<ul>
  <mt:ArchivePrevious><li><a href="<$mt:ArchiveLink$>">« 前月</a></li></mt:ArchivePrevious>
  <mt:ArchiveNext><li><a href="<$mt:ArchiveLink$>">次月 »</a></li></mt:ArchiveNext>
</ul>
<table>
  <tbody>
    <mt:ContentCalendar month="$catendarMonth" content_type="4">
      <mt:CalendarIfContents>
        <tr<mt:CalendarIfToday> class="today"</mt:CalendarIfToday>>
          <td><$mt:CalendarDate format="%e(%a)" strip=""$></td>
          <td>
            <mt:Contents>
              <mt:ContentsHeader><ul></mt:ContentsHeader>
                <li>
                  <a href="<$mt:ContentPermalink$>">
                    <mt:ContentField content_field="イベントカテゴリ"><span><$mt:CategoryLabel$></span></mt:ContentField>
                    <mt:ContentField content_field="イベント名"><mt:ContentFieldValue></mt:ContentField>
                  </a>
                </li>
              <mt:ContentsFooter></ul></mt:ContentsFooter>
            </mt:Contents>
          </td>
        </tr>
      </mt:CalendarIfContents>
      <mt:CalendarIfNoContents>
        <tr<mt:CalendarIfToday> class="today"</mt:CalendarIfToday>>
          <td><$mt:CalendarDate format="%e(%a)" strip=""$></td>
          <td>...</td>
      </tr>
      </mt:CalendarIfNoContents>
    </mt:ContentCalendar>
  </tbody>
</table>
<!-- 出力結果(長いので一部を省略しています) -->
<h1>2025年2月のイベントカレンダー</h1>
<ul>
  <li><a href="前月アーカイブのURL">« 前月</a></li>
  <li><a href="次月アーカイブのURL">次月 »</a></li>
</ul>
<table>
  <tbody>
    <tr>
      <td>1(土)</td>
      <td>
        <ul>
          <li>
            <a href="コンテンツデータ詳細">
              <span>カテゴリ名</span>
              タイトル
            </a>
          </li>
        </ul>
      </td>
    </tr>
    <tr>
      <td>2(日)</td>
      <td>...</td>
    </tr>
    <tr>
      <td>3(月)</td>
      <td>...</td>
    </tr>
    <tr>
      <td>4(火)</td>
      <td>
        <ul>
          <li>
            <a href="コンテンツデータ詳細">
              <span>カテゴリ名</span>
              タイトル
            </a>
          </li>
          <li>
            <a href="コンテンツデータ詳細">
              <span>カテゴリ名</span>
              タイトル
            </a>
          </li>
        </ul>
      </td>
    </tr>
    <tr class="today">
      <td>5(水)</td>
      <td>...</td>
    </tr>
    <tr>
      <td>6(木)</td>
      <td>...</td>
    </tr>
    <tr>
      <td>7(金)</td>
      <td>...</td>
    </tr>
    <!-- 8(土)〜26(水)までのHTMLを省略 -->
    <tr>
      <td>27(木)</td>
      <td>...</td>
    </tr>
    <tr>
      <td>28(金)</td>
      <td>...</td>
    </tr>
  </tbody>
</table>

一応、MTCalendar(記事)を利用した場合のコード例も記載しておきます(長いので折りたたみ)
こちらも前後月のリンクをつける場合は、記事リストアーカイブテンプレートの「月別」アーカイブマッピングを利用します。

MTCalendarのコード例
<mt:ArchiveDate format="%Y%m" setvar="catendarMonth">

<h1><$mt:ArchiveDate format="%Y年%m月"$>のイベントカレンダー</h1>
<ul>
  <mt:ArchivePrevious><li><a href="<$mt:ArchiveLink$>">« 前月</a></li></mt:ArchivePrevious>
  <mt:ArchiveNext><li><a href="<$mt:ArchiveLink$>">次月 »</a></li></mt:ArchiveNext>
</ul>
<table>
  <tbody>
    <mt:Calendar month="$catendarMonth">
      <mt:CalendarIfEntries>
        <tr<mt:CalendarIfToday> class="today"</mt:CalendarIfToday>>
          <td><$mt:CalendarDate format="%e(%a)" strip=""$></td>
          <td>
            <mt:Entries lastn="0">
              <mt:EntriesHeader><ul></mt:EntriesHeader>
                <li>
                  <a href="<$mt:EntryPermalink$>">
                    <span><$mt:CategoryLabel$></span>
                    <$mt:EntryTitle$>
                  </a>
                </li>
              <mt:EntriesFooter></ul></mt:EntriesFooter>
            </mt:Entries>
          </td>
        </tr>
      </mt:CalendarIfEntries>
      <mt:CalendarIfNoEntries>
        <tr<mt:CalendarIfToday> class="today"</mt:CalendarIfToday>>
          <td><$mt:CalendarDate format="%e(%a)" strip=""$></td>
          <td>...</td>
      </tr>
      </mt:CalendarIfNoEntries>
    </mt:Calendar>
  </tbody>
</table>

とりあえず覚えておくといいMTタグとモディファイア

カレンダー機能のタグは、処理と仕様が少し独特です。
以下、MTタグでEntriesとついているものは記事、Contentsとついているものはコンテンツタイプで利用します。見出しの各MTタグで/で区切ってあるもののうち、前のMTタグは記事で、後のMTタグはコンテンツタイプで利用します。

MTCalendar / MTContentCalendar

ひと月分のカレンダーを表示するためのブロックタグ。

month

表示するカレンダーの月を指定する。指定できる値はいくつかあるが、通常のカレンダーであればYYYYMMを指定でOK。

content_type

MTContentCalendarを利用する場合、対象となるコンテンツタイプの以下いずれかを指定する。指定は必須。

  • コンテンツタイプID
  • コンテンツタイプ名
  • コンテンツタイプ ユニークID

category

値に指定したカテゴリ名のカレンダーを出力する。
コンテンツタイプの場合は、category_set(値はIDまたはカテゴリセット名)も併せて指定する必要がある。

MTCalendarIfEntries / MTCalendarIfContents

表示される記事やコンテンツデータがある場合に処理される条件タグ。

MTCalendarIfNoEntries / MTCalendarIfNoContents

表示される記事やコンテンツデータがない場合に処理される条件タグ。
上記同様MTElseは利用できない。

MTCalendarDay

カレンダーの日付のみを出力する。MTCalendarIf~またはMTCalendarIfNo~の中で利用する。
日付以外も出力する場合は、MTCalendarDateを利用する。

MTCalendarDate

formatモディファイアを指定することで、カレンダーの日付以外に曜日などを出力できる。MTCalendarIf~またはMTCalendarIfNo~の中で利用する。
指定できる値は公式リファレンス参照。

MTCalendarIfToday

MTCalendarあるいはMTContentCalendar内において、「今日の日付」の場合に処理される。

MTCalendarWeekHeader

週の始まりのときに実行する条件タグ。1行が7日ずつの表組カレンダーにおいて、trタグの出力などに利用できる。

<!-- MTML -->
<mt:ArchiveDate format="%Y%m" setvar="catendarMonth">
<table>
  <thead>
    <tr>
      <th></th>
      <th></th>
      <th></th>
      <th></th>
      <th></th>
      <th></th>
      <th></th>
    </tr>
  </thead>
  <tbody>
    <mt:ContentCalendar month="$catendarMonth" content_type="4">
      <mt:CalendarWeekHeader>
        <tr>
      </mt:CalendarWeekHeader>
          <td>
          <mt:CalendarIfContents>
            <$mt:CalendarDay$>
        </mt:CalendarIfContents>
        <mt:CalendarIfNoContents>
          <$mt:CalendarDay$>
        </mt:CalendarIfNoContents>
          </td>
      <mt:CalendarWeekFooter>
        </tr>
      </mt:CalendarWeekFooter>
    </mt:ContentCalendar>
  </tbody>
</table>

<!-- 出力結果 -->
<table>
  <thead>
    <tr>
      <th></th>
      <th></th>
      <th></th>
      <th></th>
      <th></th>
      <th></th>
      <th></th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td>1</td>
    </tr>
    <tr>
      <td>2</td>
      <td>3</td>
      <td>4</td>
      <td>5</td>
      <td>6</td>
      <td>7</td>
      <td>8</td>
    </tr>
    <!-- 9〜22日までのHTMLを省略 -->
    <tr>
      <td>23</td>
      <td>24</td>
      <td>25</td>
      <td>26</td>
      <td>27</td>
      <td>28</td>
      <td></td>
    </tr>
  </tbody>
</table>

MTCalendarWeekFooter

週の終わりのときに実行する条件タグ。1行が7日ずつの表組カレンダーにおいて、trの閉じタグの出力などに利用できる。
コードサンプルは上記MTCalendarWeekHeader参照。

公式リファレンス

MT

PowerCMS

Discussion