
複数のインプレースエディターを有効にするには、cq:InplaceEditingConfig ノードタイプの構造を cq:ChildEditorConfig ノードタイプの定義で強化します。
次に例を示します。
/** * Configures inplace editing of a component. * * @prop active true to activate inplace editing for the component * @prop editorType ID of inplace editor to use * @prop cq:childEditors collection of {@link cq:ChildEditorConfig} nodes. * @prop configPath path to editor's config (optional) * @node config editor's config (used if no configPath is specified; optional) */ [cq:InplaceEditingConfig] > nt:unstructured - active (boolean) - editorType (string) + cq:childEditors (nt:base) = nt:unstructured - configPath (string) + config (nt:unstructured) = nt:unstructured /** * Configures one child editor for a subcomponent. The name of the this node will * be used as DD id. * * @prop type type of the inline editor. eg: ["image"] * @prop title totle od the inline editor * @prop icon icon to represent the inline editor */ [cq:ChildEditorConfig] > nt:unstructured orderable - type (string) - title (string)
-
cq:childEditors ノードの下に、インプレースエディターごとに新しいノードを作成します。
- 名前:各ノードの名前は、そのノードが(ドロップターゲットのように)表すプロパティの名前にしてください。例えば、image、text などです。
- タイプ:cq:ChildEditorConfig
注意:
定義されたドロップターゲットと子エディターの間には相関関係があります。cq:ChildEditorConfig ノードの名前はドロップターゲット ID と見なされ、選択された子エディターへのパラメーターとして使用されます。編集可能なサブエリアにドロップターゲット(テキストコンポーネントなど)がない場合でも、子エディターの名前は対応する編集可能エリアを識別する ID と見なされます。
- 名前:各ノードの名前は、そのノードが(ドロップターゲットのように)表すプロパティの名前にしてください。例えば、image、text などです。
注意:
詳しくは、リッチテキストエディターの設定を参照してください。
複数の RTE を含めるには、インプレース RTE ごとに次のような設定が必要です。
- cq:InplaceEditingConfig の下に、config ノードを定義します。
- config ノードの下に、個々の RTE 設定を定義します。
texttext cq:dialog cq:editConfig cq:inplaceEditing cq:childEditors config text1 rtePlugins text2 rtePlugins
注意:
各 RTE はそれぞれ異なる設定を持つことができるので、推奨されるベストプラクティスは、config ノードを cq:InplaceEditingConfig の下に定義することです。
ただし、RTE の場合、configPath プロパティがサポートされるのは、コンポーネント内のテキストエディター(編集可能なサブエリア)のインスタンスが 1 つだけのときです。この configPath のサポートは、コンポーネントの古い UI ダイアログとの下位互換性のために提供されています。
GitHub のコード
このページのコードは GitHub にあります
- GitHub の aem-authoring-hybrideditors プロジェクトを開きます
- プロジェクトを ZIP ファイルとしてダウンロードします
インプレースエディターの追加に関する一般的な情報については、ページオーサリングのカスタマイズを参照してください。