RSS 2.0
サイトコアでは、ページエディター上でインライン編集がネイティブサポートされていないフィールドを編集する場合、フィールドエディターを使用します。フィールドエディターでフィールドを編集する場合、 EditFrame Webコントロールと FieldEditorCommand コマンド定義アイテムを組み合わせて使用します。既定で用意される FiedEditorCommand を使用する場合、フィールドという名前のフィールドにフィールドエディターで編集できるフィールドをパイプ区切りで指定します。この場合、フィールドエディターで編集したいフィールドの組み合わせごとに FieldEditorCommand 型のアイテムを作成していくことになります。
その結果、 /sitecore/content/Applications/WebEdit/Edit Frame Buttons アイテム配下にEditFrameコントロール用のフリーツールバーに表示するコマンドセットの定義が増加していくことになります。
今回は、カスタムの FieldEditorCommandクラスを作成して、 スタンダードフィールド以外のフィールドをフィールドエディターで編集できるようにしてみます。カスタムフィールドエディターコマンドを使用する場合は FieldEditorCommand定義アイテムではなく、通常の Edit Frame Small Button 型のコマンド定義アイテムを作成します。
検証環境
- Sitecore CMS 6.6 Service Pack1
- クライアント構成クックブックのカスタムのフィールド エディターの実装方法を参照に作成
1. カスタムフィールドコマンドクラスの作成
今回は、 Sitecore 用のプロジェクトに CustomFieldEditorCommand.cs というFieldEditorCommandクラスを作成しました。カスタムフィールドエディターコマンドを作成する場合、 FieldEditorCommand クラスを継承するクラスを作成します。 GetOptions メソッドをオーバーライドして、フィールドエディターで編集可能にする FieldDescriptor のコレクションを格納した PageEditFieldEditorOptions クラスのインスタンスを作成します。
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Sitecore.Shell.Applications.WebEdit;
using System.Collections.Specialized;
using Sitecore.Data;
using Sitecore.Data.Items;
using Sitecore.Data.Fields;
using Sitecore.Diagnostics;
using Sitecore.Data.Managers;
using Sitecore.Data.Templates;
namespace SCSample.Web.layouts
{
/// <summary>
/// Sitecore.Client への参照の追加が必要(ローカルコピーをfalseに)
/// </summary>
public class CustomFieldEditorCommand : Sitecore.Shell.Applications.WebEdit.Commands.FieldEditorCommand
{
protected override PageEditFieldEditorOptions GetOptions(Sitecore.Web.UI.Sheer.ClientPipelineArgs args, NameValueCollection form)
{
List<FieldDescriptor> list = new List<FieldDescriptor>();
ItemUri uri = ItemUri.Parse(args.Parameters["uri"]);
Item item = Database.GetItem(uri);
// フィールドをロード。
// ReadAllをしないと、foreach でFieldsの列挙ですべてのフィールドを取得できない
item.Fields.ReadAll();
TemplateItem standardTemplate = item.Database.GetTemplate(Sitecore.TemplateIDs.StandardTemplate);
foreach (Field f in item.Fields)
{
if (standardTemplate.GetField(f.ID) != null) continue;
list.Add(new FieldDescriptor(item, f.Name));
}
//TemplateField[] fields = TemplateManager.GetTemplate(item).GetFields();
//foreach (var f in fields)
//{
// // スタンダードフィールドはスキップ
// if(standardTemplate.GetField(f.ID) != null) continue;
// if (item.Fields[f.ID].CanWrite)
// {
// list.Add(new FieldDescriptor(item, f.Name));
// }
//}
PageEditFieldEditorOptions options = new PageEditFieldEditorOptions(form, list);
options.DialogTitle = item.Name;
options.Title = item.DisplayName;
options.Icon = item[Sitecore.FieldIDs.Icon];
return options;
}
}
}
CustomFieldEditorCommand の定義はシンプルな定義となっていますので、各要求に合わせてカスタマイズしていけると思います。
2. Commands.config にコマンドの定義を作成
/App_Config/Commands.config にカスタムフィールドエディターを使用する コマンドの定義を作成します。今回は次のように webedit:fieldeditor:custom というコマンドを作成しました。
<command name="webedit:fieldeditor:custom" type="SCSample.Web.layouts.CustomFieldEditorCommand, SCSample.Web"/>
3. Edit Frame Buttons 配下にコマンドの定義を作成
EditFrame で使用するフリーツールバーのコマンドセットの定義は Core データベースの /sitecore/content/Applications/WebEdit/Edit Frame Buttons/ 配下に作成します。カスタムのボタンを定義する場合、既存のEditFrameに影響しないように /sitecore/content/Applications/WebEdit/Edit Frame Buttons/Default を複製してカスタムコマンドの定義を作成していきますが、今回は Defaultアイテム配下にカスタム のコマンドの定義アイテムを作成します。Defaultアイテムを選択して、 挿入グループから Edit Frame Small Button を選択します。カスタムのフィールドエディターコマンドを使用するため、 Field Editor Button ではないことに注意してください。
今回は、 FieldEditorCustom という名前で コマンドの定義アイテムを作成しました。作成したアイテムを選択して 例えば下図のようにフィールドを編集します。 クリックフィールドには webedit:fieldeditor:custom という Commands.config で定義したコマンド名を設定します。他はなんでもいいですが、今回な例のためパラメーターフィールドにも値を設定しています。
以上で準備ができました。
4.動作確認
サブレイアウトまたは、 レイアウトで、 EditFrame コントロールを配置して動作確認をします。
EditFrame.Buttons は既定で Coreデータベースの /sitecore/content/Applications/WebEdit/Edit Frame Buttons/Default のコマンドをフリーツールバーに表示します。
カスタムのコマンドセットを作成した場合はそのアイテムのパスを設定してください。必要があれば DataSource プロパティなども設定します。
EditFrame コントロールをページエディター上で選択して、 先ほど作成した FieldEditCustom のコマンドを選択します。
フィールドエディターが表示され スタンダードフィールド以外のフィールドを 編集できるようになります。
今回はスタンダードフィールド以外のフィールドをフィールドエディターで編集できるようにしましたが、 Edit Frame Small Button 型のアイテムのパラメーターフィールドにテンプレート名をキー、 値に編集できるようにするフィールドを指定することで、 1つのエディットフレームボタンの定義で複数のアイテムの種類のケースに対応するなどの 応用が行えます。 パラメーターの値は、args.Parameters["p1"]; などの方法で参照することができます。
5.まとめ
説明は以上です。今回 カスタムフィールドエディターコマンドを定義することで、 フィールドエディターで編集できるようにしたい フィールドの組み合わせごとに Field Editor Button を定義しないで済むようにしてみました。
後で気づいたのですが、 Marketplace でも同じようなモジュールが公開されていたのでご紹介します。
DEFAULT FIELD EDITOR
http://marketplace.sitecore.net/en/Modules/Default_Field_Editor.aspx