Movable Typeの標準の状態では，ブログ記事に入力できるフィールドはタイトルと本文くらい（他にもありますが）しかありません。しかし例えば商品カタログのページを作りたいと思ったとき，価格や色，サイズなどの入力項目が欲しくなってきます。それを実現するのが「カスタムフィールド」機能です。

「カスタムフィールド」機能を使えば，ブログページやウェブページに独自の入力項目を追加することができるようになり，eコマース，商品カタログ等の定型ページ制作の入力がより簡単にできるようになります。

今回は，MTをCMSとして使うには書かせないカスタムフィールド機能を最もシンプルに使った，商品紹介ページの作成方法について解説していきます。

今回の連載を通して作成しているサイト全体でいうところの，「⁠商品一覧」のディレクトリの部分をMT化していきます。

なお，カスタムフィールド機能はオープンソース版（MTOS）では利用できませんのでご注意ください。

HTMLテンプレートの用意とカスタムフィールドの作成

あらかじめ，MTカスタマイズ前のプレーンなHTMLテンプレートを用意しておきましょう。今回は以下の2つのHTMLテンプレートをMT化していきます。

• 商品一覧ページ（product/index.html）
• 商品紹介個別ページ（product/individual.html）

それでは「商品一覧」のブログを新規で作成しましょう。

ブログを新規作成で，テーマは「クラシックブログ」「⁠ブログ名（ここでは「商品一覧」としています⁠）⁠」⁠，「⁠ブログURL（…/product/⁠）⁠」⁠，「⁠ブログパス（…/product/⁠）⁠」を入力し，ブログを再構築してください。

次に，カスタムフィールドを作成していきます。

今回作成するカスタムフィールドは5つ，「⁠商品画像」「⁠価格」「⁠カラー」「⁠サイズ」「⁠素材」です。つまり図4で，個別記事で定型化して更新したい箇所をカスタムフィールド化することにします。

左メニューにある，カスタムフィールド > 新規 から制作しましょう。

作成するカスタムフィールドと値は以下のとおり。

カスタムフィールドのテンプレートタグ名は，必ず他のMTタグと被らないよう，オリジナルな名称になるようにしてください。

表　作成するカスタムフィールドと値

名前	オブジェクト	説明	種類	必須？	既定値	ベースネーム	テンプレートタグ
商品画像	ブログ記事	300×300の商品画像をアップロードしてください	画像	YES		image	image
価格	ブログ記事		テキスト	YES		price	price
カラー	ブログ記事		テキスト	YES		color	color
サイズ	ブログ記事		テキスト	YES		size	size
素材	ブログ記事		テキスト	YES		material	material

これで5つのカスタムフィールドができあがりました。

ブログ記事の入力画面を確認してみると，設定したカスタムフィールドの入力項目が出ていますね。

※　入力項目を「必須」にしていないカスタムフィールド項目は，デフォルトでは記事の入力画面には出てきません。記事の入力画面の右上にある「表示オプション」から，入力画面に表示させたい項目を選択してください。