• Home
  • MTAppjQuery
  • $.MTAppInCats() の使い方 - MTAppjQuery でカテゴリごとにUIを変える

$.MTAppInCats() の使い方 - MTAppjQuery でカテゴリごとにUIを変える

MTAppjQuery - Movable Type 5 の管理画面をjQueryでカスタマイズしやすくするプラグイン」に $.MTAppInCats() というjQueryプラグインを追加しました。現在のバージョンは 0.09 です。

MTAppInCats-01.png

$.MTAppInCats() を利用することで、ブログ記事作成・編集画面の UI をカテゴリごとにカスタマイズすることができます。きっと、一部の人には待望の機能かと。

使い方

使い方は簡単で、次のように user.js に書けばOKです。

$.MTAppInCats({
    categories: '1,2,3', // カテゴリIDを指定。複数の場合はカンマ区切り
    code      : function(){
        // ここに指定したカテゴリのみに適用させたいカスタマイズを書く
    }
});

新規ブログ記事作成の場合は、ここで指定したカテゴリを選択した場合に UI が変更されます。そのカテゴリに属する記事を編集する場合は、最初から指定した UI となります。

この code オプションの function の中には、MTAppjQuery で利用できるその他の jQuery プラグインが使えます。

サンプル

例えば、キーワード欄を、次のように使い分ける場合を考えてみます。

  • 通常の場合 : ラベルを「キャッチフレーズ」にカスタマイズしたテキストフィールド
  • カテゴリIDが3のカテゴリの場合 : ラベルを「ジャンル」としたマルチチェックボックス

通常の場合 : ラベルを「キャッチフレーズ」にカスタマイズしたテキストフィールド

この場合は、user.js に次のように書きます。

$.MTAppCustomize({
    basename: 'keywords',
    label: 'キャッチフレーズ',
    hint: 'ここにはキャッチフレーズを入れましょう!'
});

カテゴリIDが3のカテゴリの場合 : ラベルを「ジャンル」としたマルチチェックボックス

この場合は、user.js に次のように書きます。ただし、カテゴリごとに指定する UI は、通常の場合の設定を上書きしなければならないので、上記で指定した「通常の場合」よりも後に、カテゴリごとのカスタマイズを記述する必要があります。

$.MTAppInCats({
    categories: '3',
    code      : function(){
        $.MTAppCustomize({
            basename: 'keywords',
            label: 'ジャンル',
            hint: '記事が属するジャンルを選択してください'
        });
        $.MTAppMultiCheckbox({
            basename: 'keywords',
            label:    'Moveble Type,MTOS,TypePad,VOX'
        });
    }
});

このように、code:function(){ } 内には、MTAppjQueryプラグインに同梱されている jQuery プラグインも使うことができます。

プラグインの詳細やダウンロードは以下からお願いします。

MTAppjQuery について

Movable Type の管理画面をフロントエンドの知識だけで簡単にカスタマイズすることができます。

クライアントの満足度を高めるためにぜひお使いください。

MTAppjQuery の詳細を見る

Iamge Description

Recent Entries

Pickup Categories

Movable Type

CMSとして国内5万サイト以上に導入されている Movable Type に関する記事です。

Craft CMS

CMS 業界で注目の Craft CMS に関する記事です。Craft CMS はチーム全体をハッピーにしてくれる素晴らしい CMS です。