MODXのテンプレート変数の使い方

最終更新日
2017.10.08

移行作業中のため一部のページが正しく表示されていない場合があります(o-ω-))

MODX のテンプレート変数の使い方を説明します。

Evo には「本文」や「リソース名」という基本のリソース変数がありますが、「テンプレート変数」はそれと同じように自由な入力・選択項目を増やせる機能です。WordPress でいうところのカスタムフィールドとだいたい同じです。

どんな時に使うか

リソース毎に違う内容にしたいオプション情報、例えばイメージ画像や商品価格など情報として独立させておきたい場合に使用します。

単に同じ内容を複数のページで使いまわしたい場合はチャンクを使う方が適切です。

何通りか内容があってリソースによって選択したい場合テンプレート変数ではチャンク名を選べるようにして実際表示する時にチャンクの内容を持ってくれば内容を変更したい場合チャンクを修正するだけで全てのリソースに反映されます。

テンプレート変数の設定項目

項目 説明
変数名 タグに使用する名前。
日本語も使えるので「商品画像」や「商品価格」など分かりやすい名前をつけてもOK
見出し 投稿画面の表示用の名前
入力タイプ 入力フォームのタイプを選択、カスタム入力タイプも可能
オプション 入力タイプでの選択肢などのオプション項目やカスタム入力タイプの本体
既定値 入力・選択しなかった時のデフォルトの値
既定値を編集すると項目が既定値のまま登録されている既存のリソースも書き換わります
出力フィルタ(ウィジェット) 表示する方法を設定、カスタム出力フィルタも可能
プロセッサの設定 プロセッサのプロパティの内容

入力フォームは1行テキスト、複数行テキスト、ドロップダウンメニュー、ファイル用フォームなどなど色々なタイプが用意されていますが、どれにも当てはまらなければ自作フォームを作ることもできます。

添付ファイルの扱い

Evo のファイル用フォームはリソースにファイルを直接紐付けてアップロードするわけではなくイメージブラウザからファイルをアップロードしてリソースにはその「ファイルパス」を紐付けます。FTP で画像をUPする代わりにそれをブラウザで行うだけです。リソースを削除しても使用している画像は削除されないので同じ画像を別のリソースで使いまわす事もできます。

タグの書き方

[*変数名*]

ちなみに変数名には日本語も使用できます。

スニペットのパラメータに使用したりチャンクの名前としてネストする事もできます。

[[snippet? &var=`[*変数名*]` ]]
{{[*変数名*]}}

新しいテンプレート変数(項目)の作成

Evo のテンプレート変数はテンプレートと関連付けて作成します。

テンプレートに関連付ける事でその項目が必要なリソースにだけ入力フォームを表示させます。なのでテンプレートは全てのページで同じものを使うよりリソースの目的である程度分けるのがオススメ。

例で商品情報用のリソースに対して「商品価格」という項目を追加することにします。

あらかじめ「商品一覧用テンプレート」と「商品詳細用テンプレート」の2種類のテンプレートといくつかリソースを作ってあるとします。

リソース名 使用するテンプレート名
くだもの一覧 商品一覧用のテンプレート
りんご 商品詳細用のテンプレート
ばなな 商品詳細用のテンプレート

新しいテンプレート変数を作成する

上の画面から新しいテンプレート変数を作成します。変数名は呼び出す時に使用するタグに使う名前で見出しは入力画面で表示される項目名です。

テンプレートとの関連付け

次に「テンプレートとの関連付け」のオプションで「商品価格」変数と関連付けるテンプレートを選択します。

この場合関連付けする必要があるのは「商品価格」を入力させる商品詳細ページで使っている「商品詳細用テンプレート」だけでOKです。商品一覧ページではただ使用するだけなのでそこで使っているテンプレートへの関連付けは不要。

ちなみに不要な関連付けをしていても別に不具合が起きるとかは無くただ使わないフォームが表示されるだけなので安心してください。

「商品情報用テンプレート」を使用して編集画面を開いてみましょう。リソースで本文テキストエリアの下に以下のように新しい項目が増えていればテンプレート変数の設定ができました。

変数を使用する

フォームに価格を入力してリソースを作成してみましょう。

ここで入力した内容を使用するには、商品詳細テンプレートの表示したい場所に[*price*]と記述します。

関連付けていない商品一覧テンプレートから Ditto などスニペットを使って各商品価格を表示したい場合はプレースホルダ(例:[+price+])で使用する事ができます。※スニペットによってはプレフィックスが付く場合もあります。

チャンクを使用してテンプレート変数の内容を切り替える例

「注意事項A」と「注意事項B」という2パターンの記述があってリソース毎にどちらを表示するかを選択させる方法です。テンプレート変数とチャンクを使用します。

「notes.A」「notes.B」というチャンクを作成してそれぞれの注意事項を記述します。

テンプレート変数で「注意事項」という項目を作成し、表示させたいテンプレートと関連付けておきます。

設定内容は以下のような感じにします。

入力タイプにドロップダウンなどの選択肢が設定できるものを選択してオプションを以下のようにします。

注意事項A==A||注意事項B==B

出力フィルタのカスタムウィジェットを使用する場合内容には

{{notes.[+value+]}}

などと書けばチャンクの内容を表示する事ができます。

カスタムフィルターを使用しないでテンプレート変数の値から直接チャンクを表示する場合は、テンプレートに以下のように書いておけば選択された方のチャンクの内容が表示されます。

{{notes.[*注意事項*]}}

ドロップダウンやラジオボタンに「なし」の選択肢を作る

項目名だけを設定して項目値を空にすることで「なし」の選択肢を作る事ができます。

なし==||注意事項A==notes.A||注意事項B==notes.B

API

特定のリソースのリソース変数・テンプレート変数の内容を取得

$modx->getTemplateVarOutput($idnames= array(), $docid= '', $published= 1, $sep='');

現在のドキュメントのテンプレート変数の情報を取得

// 配列版
$modx->documentObject[ 変数名 ][0] // 変数名
$modx->documentObject[ 変数名 ][1] // 内容
$modx->documentObject[ 変数名 ][2] // 出力タイプ
$modx->documentObject[ 変数名 ][3] // 出力オプション
$modx->documentObject[ 変数名 ][4] // 入力タイプ
// 連想配列版
$modx->documentObject[ 変数名 ]['name'] // 変数名
$modx->documentObject[ 変数名 ]['value'] // 内容
$modx->documentObject[ 変数名 ]['display'] // 出力タイプ
$modx->documentObject[ 変数名 ]['display_params'] // 出力オプション
$modx->documentObject[ 変数名 ]['type'] // 入力タイプ

連想配列は日本語版じゃないと使えないみたい。

外部情報

Revo ではデフォルトで Custom input や Custom Widget がないのでどうするのかなぁと思ったんですけど、新しい入出力方法を作るにはフォルダに直接ファイルを作成するみたいですね。そのようなパッケージもいくつか存在してました。

http://rtfm.modx.com/display/revolution20/Adding+a+Custom+TV+Input+Type