小粋空間  -  a cheap joke and a play on words site

カスタムフィールドでアップロードした画像をテンプレートタグで表示する

Movable Type 4.1 で追加されたカスタムフィールド機能で、画像（アイテム）をアップロードすると、記事中にはテキストリンクしか表示されないため「なんとかならないでしょうか？」というコメントを多く頂いてます。

その関係で、先日「カスタムフィールドによるアップロード画像をサムネイルで表示するプラグイン VisibleCustomFieldImage」を公開しましたが、Movable Type の公式サイトにテキストリンクではなく、画像を表示する方法が掲載されています。

カスタムフィールドでアップロードしたアイテムを表示するには

Via：MT4.1のカスタムフィールドで指定した画像を素直なタグで出力する。

この方法を使えば、より簡単に画像を表示することができます。
ということで、本エントリーにて具体的な設定方法を情報展開しておきます。

サンプルとして、次のようなカスタムフィールドを作成します。

ブログ記事に表示されたカスタムフィールドを使って、次の画像をアップロードします。

テンプレートモジュール「ブログ記事の概要」に、次のタグを設定します。

<MTIfNonEmpty tag="photo">
<MTphotoAsset><img src="<$MTAssetURL$>" /></MTphotoAsset>
</MTIfNonEmpty>

カスタムフィールドの作成時に指定したテンプレートタグの末尾に「Asset」を追加したテンプレートタグ名がブロックタグとして使えます。サンプルでは、「MTphoto」というタグを作ったので「MTphotoAsset」となります。
そして、このブロックタグの中では、Movable Type 標準のアイテム関連タグが利用できます。

上のタグをテンプレートモジュールの次の位置に設定します。

「てすと」というタイトルで投稿すると、次のように表示されました。

次に、MTAssetThumbnailLink タグでサムネイル指定をしてみます。

<MTIfNonEmpty tag="photo">
<MTphotoAsset><$MTAssetThumbnailLink width="150"$></MTphotoAsset>
</MTIfNonEmpty>

上のタグをテンプレートモジュール次の位置に設定します。

「てすと」というタイトルで投稿すると、次のようにサムネイルが表示されました。