脱・単なる入力欄!Movable Typeのカスタムフィールドで実装する高度なWeb運用ノウハウ
Movable Type(MT)を構築・運用する際、「カスタムフィールド」をどのように設計しているでしょうか。単に「標準の本文入力欄では足りないテキストや画像を追加するための項目」として使っているだけなら、それはMovable Typeのポテンシャルを半分も活かせていないかもしれません。
カスタムフィールドの真価は、単なるデータの入れ物ではなく、「表示ロジックを制御するスイッチ」や「データを構造化して再利用するための仕組み」として機能させる点にあります。適切に設計・実装することで、サイトの表現力を劇的に高めるだけでなく、クライアントやWeb担当者の入力ストレスを大幅に軽減できます。
1. デザインや表示ロジックを制御する(フラグ・スイッチ利用)
カスタムフィールドを「条件分岐の判定材料」として使う手法です。HTMLやCSSのコード知識がない運用者でも、管理画面のチェックボックスや選択肢を選ぶだけで、高度な表示切り替えが可能になります。
- 「ピックアップ・トップ固定」フラグ(チェックボックス)
記事の編集画面に「トップページに掲載する」というチェックボックス形式のカスタムフィールドを用意します。テンプレート側でこのフィールドが「1(ON)」になっている記事だけを抽出して出力する処理を記述しておけば、特定の記事をトップページのメインビジュアル下やお知らせの先頭に動的に配置できます。 - レイアウトやCTAボタンの個別切り替え(ドロップダウン)
記事ごとに「1カラム / 2カラム」などのレイアウトや、「お問い合わせボタンA(資料請求) / ボタンB(見積もり)」などの誘導先CTAを選択できる項目を作成します。記事の内容やターゲット属性に合わせて、管理画面からワンタップでページ構成を変更できるようになります。 - グローバルナビ・一覧からの非表示スイッチ(チェックボックス)
キャンペーンLPやサンクスページなど、ウェブページ機能で作成しつつも「サイトマップやグローバルナビには自動出力させたくない」ページが存在します。「ナビゲーションに表示しない」スイッチを用意しておけば、テンプレート側の条件分岐でスマートに除外できます。
2. コンテンツを構造化して表現力を高める
本文エリア(WYSIWYGエディタ)の中に画像やデータを直接流し込むと、デザインの統一性が崩れたり、レスポンシブ対応で表示が乱れたりする原因になります。要素ごとにカスタムフィールドへ分離(構造化)するのが鉄則です。
- 一覧用サムネイルとOGP画像の切り分け(画像フィールド)
本文中の画像とは別に、「一覧ページ用サムネイル」「SNSシェア(OGP)用画像」を独立したフィールドとして持たせます。これにより、MTEntryImageAsset タグを活用した自動リサイズ処理や、レスポンシブな画像配信の制御が極めて容易になります。 - イベント・セミナーの「開催日時」管理(日付・時刻フィールド)
記事の「公開日(投稿日)」とは別に、実際の「イベント開催日時」を入力するフィールドを設けます。こうすることで、投稿日順ではなく「イベント開催が近い順」に一覧を並び替えて表示したり、開催期日が過ぎたイベントを自動的に過去アーカイブへ移動させたりするロジックが組めるようになります。 - カテゴリ別の専用入力欄(カテゴリ連携)
「店舗情報」カテゴリを選んだときだけ「住所・営業時間」フィールドを表示させるといった設定を活用します。入力者にとって無関係な入力項目を非表示にすることで、入力漏れや誤入力を防ぎ、運用の標準化を図ることができます。
3. システムオブジェクト(カテゴリ・フォルダ)の拡張
カスタムフィールドは「記事」や「ウェブページ」のためだけのものではありません。「カテゴリ」や「フォルダ」といったシステムオブジェクトに対しても作成可能です。
- カテゴリ別のヘッダー画像・説明文の管理
カテゴリに対して「一覧ページ用バナー画像」や「カテゴリの解説テキスト」のフィールドを追加しておくと、カテゴリ一覧(アーカイブ)ページの最上部に、動的にバナーやSEOテキストを出力できます。ハードコーディングを減らし、運用側でカテゴリごとの見せ方を柔軟に制御できるようになります。
実務で使える実装コード例:イベント日時の制御
ここでは、日付・時刻タイプのカスタムフィールド(ベースネーム:event_date)を使用し、「今後開催されるイベントのみを開催日時順(昇順)で一覧表示する」実装パターンを紹介します。
<!-- 現在日時を取得 -->
<mt:Date format="%Y-%m-%d %H:%M:%S" var="now">
<!-- 未来のイベントのみを抽出してループ(1970年以降など範囲指定) -->
<mt:Entries field:event_date="$now..2099-12-31 23:59:59" sort_by="field:event_date" sort_order="ascending">
<div class="event-item">
<a href="<mt:EntryPermalink>">
<h3><mt:EntryTitle></h3>
<p class="event-date">開催日:<mt:CustomFieldValue identifier="event_date"></p>
</a>
</div>
</mt:Entries>
まとめ:設計の差が「ヘルプデスクの工数」を左右する
Movable Typeのカスタムフィールドを単なる「入力欄の拡張」として捉えるか、「コンテンツの構造化と表示ロジックの制御装置」として捉えるかで、完成するWebサイトのクオリティと運用効率には雲泥の差が生まれます。
管理画面を使うクライアントやWeb担当者が「どこに何を入れるべきか迷わない」インターフェースを意識しつつ、テンプレート側で制御しやすいルールを設計することが、公開後の運用トラブルを減らし、長く愛されるWebサイト構築へとつながります。
アカルでは、カスタムフィールドの便利な使い方に関するノウハウを多く蓄積しております。「MTって、こういうことできますか?」という、ちょっとした疑問・ご相談もお受けしています。ぜひお気軽にご相談ください。



