【MovableType】A-formの入力画面テンプレートをカスタマイズ

電脳備忘録

Aformで出力される項目ごとにスタイルをあてたいという相談を受けたので、別途テンプレートを用意して対応しました。
各パーツにはpartsIDが割り振られていて1項目ごとに定義リストで出力されようなので、partsIDを取得してdlのclass名として設定してしまえばあとはcssで何とかなるだろうと...。

入力パーツのパーツID値はモディファイア parts_id で取得できます。
例えばパーツIDが event だったらAの処理をし, それ以外ならBの処理をしたい場合は次のように書きます。

入力パーツのパーツIDを取得するのに使える変数

これでdlにclass名を振ることができました。(aform_form.tmplに記述)

<dl class="<$mt:GetVar name="parts_id"$>">

再構築するとこんな感じで出力されました。あとは何とかしておくれ...

<dl class="parts-1">
<dt><label for="parts-1" class="aform-label parts-1">質問項目<span class="required">(必須)</span></label>
</dt>
<dd>
<input id="parts-1" class="aform-input aform-text parts-1 required" name="aform-field-52" type="text" value="" size="40" title="入力してください">
<p class="aform-error parts-1" id="parts-1-error"></p></dd>
</dl>

広告

ブログの維持費に充てるでございます・・・。