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

Movable Type Data APIの使い方：カスタムフィールド作成

Movable Type 6から提供されているData APIの使い方を紹介します。

本エントリーでは、JavaScript SDK APIのcreateField()を使ったカスタムフィールドの作成方法について解説します。

このAPIはMT6.1から有効です。

１．基本

createField()は、カスタムフィールドの作成を行うためのAPIです。

createField()を使ったカスタムフィールドの作成を行うための簡単なサンプルを紹介します。

<script>
// API生成コード等は省略
 
var siteId = 2;
$('#create').click(function(){
    var data = {
        'systemObject': $('#systemObject').val(),
        'name' : $('#name').val(),
        'description' : $('#description').val(),
        'required' : $('#required').prop('checked'),
        'default' : $('#default').val(),
        'type' : $('#type').val(),
        'basename' : $('#basename').val(),
        'tag' : $('#tag').val()
    };
    api.createField(siteId, data, function(response) {
        if (response.error) {
            $('#result').html('エラー:' + response.error.message);
        } else {
            $('#result').html('作成しました');
        }
    });
});
</script>
 
<ul>
<li><input type="text" id="systemObject" />システムオブジェクト</li>
<li><input type="text" id="name" />名前</li>
<li><input type="text" id="description" />説明</li>
<li><input type="text" id="type" />種別</li>
<li><input type="checkbox" id="required" />必須?</li>
<li><input type="text" id="default" />既定値</li>
<li><input type="text" id="basename" />ベースネーム</li>
<li><input type="text" id="tag" />タグ</li>
<li><input type="button" id="create" value="作成" />
</ul>
<div id="result"></div>

JavaScriptライブラリのインクルードやapiの生成については「Movable Type Data APIの使い方（JavaScript SDKを使ったオブジェクトの生成）」を参照してください。

また、エラーのハンドリングについては「Movable Type Data APIの使い方（エラーのハンドリング）」を参照してください。

なお、上記のサンプルでは結果表示処理でjQueryを利用しているので、jQueryのインクルードも行ってください。

２．パラメータ

createField()に設定するパラメータは次のとおりです。第2パラメータのdataはハッシュで設定します。

• siteId：ブログID（必須）
• data：作成するカスタムフィールドの情報（必須）
• callback：コールバック処理（オプション）

第2パラメータのdataの詳細は次のとおりです。

• systemObject：システムオブジェクト（必須）
• name：カスタムフィールドの名前（必須）
• description：カスタムフィールドの説明
• required：必須の場合、1を設定
• default：既定値
• options：オプション
• type：種別（必須）
• basename：ベースネーム
• tag：テンプレートタグ
• showInTheseCategories：カスタムフィールドにひもづけるカテゴリID

システムオブジェクトに設定する値は次のとおりです。

• ブログ記事：entry
• ウェブページ：page
• コメント：comment
• アイテム：file
• オーディオ：audio
• ビデオ：video
• 画像：image
• カテゴリ：category
• フォルダ：folder
• テンプレート：template
• ブログ：blog
• ウェブサイト：website

種別に設定する値は次のとおりです。

• テキスト：text
• テキスト（複数行）：textarea
• チェックボックス：checkbox
• URL：url
• 日付と時刻：datetime
• ドロップダウン：select
• ラジオボタン：radio
• 埋め込みオブジェクト：embed
• アイテム：file
• オーディオ：audio
• ビデオ：video
• 画像：image

種別から「日付と時刻」を選択した場合、optionsに下記の設定が必要と思われます。

• 日付と時刻：datetime
• 日付：date
• 時刻：time

ベースネームとテンプレートタグは省略可能です。

ベースネームを省略した場合、名前から生成するようです（日本語の場合もそのまま）。

テンプレートタグを省略した場合、システムオブジェクト名に名前の半角英数から取得したものを結合するようです。

showInTheseCategoriesの設定イメージは次のとおりです。

var data = {
    'systemObject': $('#systemObject').val(),
    …中略…
    'showInTheseCategories' : [ {"id":"1"}, {"id":"2"} ]
};

全体を配列にし、紐づけたいカテゴリのカテゴリIDをハッシュで指定します。

管理画面では作成後でしかカテゴリのひもづけを設定できませんが、Data APIを利用すれば一度に設定することができます。

３．レスポンス

作成に成功した場合のレスポンスとして、次のようなJSONデータが返却されます。

{"options":null,"updatable":true,"name":"foo","default":"テスト","blog":{"id":"2"},"description":"test","systemObject":"entry","basename":"foo","showInTheseCategories":[{"label":"cat1","id":"1"},{"label":"cat2","id":"2"}],"required":true,"id":"1","type":"text","tag":"entryfoo"}