MTAppCustomize
編集画面のフィールドをまとめてカスタマイズする。ラベル変更・クラス追加・表示制御・ヒント表示・折りたたみ化を basename 指定で行う。
記事・ウェブページ編集画面の各フィールドをまとめてカスタマイズする静的メソッドです。ラベルの変更、クラスの追加、表示/非表示の切り替え、ヒント(吹き出し)の表示、非編集モード(クリックで開閉)への変更を、1回の呼び出しで指定できます。本文(body)・追記(more)・アセット・カスタムフィールド・ウィジェットなど、対象を basename で指定します。
構文
$.MTAppCustomize(options);静的メソッド($.MTAppCustomize)です。対象フィールドの jQuery オブジェクトを返します(basename 未指定時は false)。
パラメータ
options {Object} — basename が必須です。
| プロパティ | 型 | 既定値 | 説明 |
|---|---|---|---|
basename | string | '' | 必須。対象フィールドのベースネーム。body/more/assets は本文・追記・アセット欄を指す。空なら警告して中断する |
label | string | '' | 変更後のラベル名 |
addClass | string | '' | フィールドに追加するクラス名 |
hint | string | '' | ヒント(吹き出し)に表示するメッセージ(内部で MTAppshowHint を使用) |
showField | string | '' | フィールドの表示制御。'show' で表示、'hide' で非表示(body/more の場合はタブの表示制御) |
showParent | string | '' | 本文/追記の親要素の表示制御。'show'/'hide'(basename が body または more のときのみ有効) |
custom | boolean | false | カスタムフィールドの場合 true(basename に customfield_ が前置される) |
widget | boolean | false | ウィジェットの場合 true |
edit | boolean | false | 非編集モード(クリックで開閉する折りたたみ表示)にする場合 true |
add_class | string | — | 非推奨。addClass のエイリアス |
show_field | string | — | 非推奨。showField のエイリアス |
show_parent | string | — | 非推奨。showParent のエイリアス |
戻り値
{jQuery | boolean} — 対象フィールドの jQuery オブジェクト。basename 未指定時は false。
使用例
ラベル変更とヒント表示
$.MTAppCustomize({ basename: 'title', label: '見出し', hint: '40文字以内で入力してください' });カスタムフィールドにクラスを追加して非表示
$.MTAppCustomize({ basename: 'note', custom: true, addClass: 'note-field', showField: 'hide' });折りたたみ(非編集モード)にする
$.MTAppCustomize({ basename: 'extra', custom: true, edit: true });user.js での記述例
user.js(「デザイン → user.js を編集」)に書く場合は、mtappVars.screen_id で画面を判定して呼び出します。
(function ($) {
if (typeof mtappVars !== 'object') return;
if (mtappVars.screen_id === 'edit-entry') {
$.MTAppCustomize({ basename: 'title', label: '見出し', hint: '40文字以内で入力してください' });
}
})(jQuery);補足
custom: trueのとき、basenameには自動でcustomfield_が前置されます(例:note→customfield_note)。labelを変更すると、basename: 'title'の場合はタイトル欄の placeholder も同じ文言に設定されます。hintを指定するとMTAppshowHintを使ってラベルにホバーで吹き出しを表示します。ヒントは HTML として描画されるため、信頼できない値は渡さないでください。edit: trueのときは、ラベルの後ろに編集アイコンを追加し、div.field-contentを初期非表示にします。アイコンのクリックで開閉します。showParent: 'hide'は本文/追記欄を画面外(position: absoluteで-9999px)へ退避します。'show'で元に戻します。
MTAppSetLabel との違い
ラベルの変更は MTAppSetLabel でもできますが、性格が異なります。
- MTAppCustomize: フィールド単位(
basename)の総合カスタマイザで、ラベル変更はその一機能です。ラベルは$label.text()で要素の中身を丸ごと置換します(旧テキストの指定は不要)。このため、ラベル内に必須マークやアイコンなどの子要素があると一緒に消えます。あわせてクラス追加・表示/非表示・ヒント・折りたたみ・placeholder 更新なども行えます。 - MTAppSetLabel:
[セレクタ, 旧テキスト, 新テキスト]の配列で複数のラベルを一括置換します。テキストノードの旧→新を部分置換するため、ラベル内の子要素は残ります。フィールド以外(テーブル見出しなど)も対象にできます。
1フィールドをスタイルやヒント込みで整えるなら本メソッド、複数ラベルのテキストだけを手早く改名するなら MTAppSetLabel が向いています。
関連
MTAppshowHint— ラベルにホバーで吹き出しヒントを表示する(本メソッドが内部で利用)。MTAppMakeField— メインカラムに新しいフィールドを生成する。MTAppMoveToWidget— 既存フィールドをサイドバーのウィジェットへ移動する。