コンテンツフラグメント用コンポーネント

フラグメントオーサリング用コンポーネント

注意

フラグメントエディターで使用する実際のコンポーネントは、変更される可能性があるので、拡張または変更しないことをお勧めします。

コンテンツフラグメント管理API — クライアント側を参照してください。

ページオーサリング用コンポーネント

注意

コンテンツフラグメントコアコンポーネントが推奨されます。詳しくは、コアコンポーネントの開発を参照してください。

この節では、コンテンツフラグメント用に提供されるオリジナルコンテンツについて説明します（一般グループのコンテンツフラグメント）。

メモ

詳細については、「コンテンツフラグメントレンダリング用のコンポーネントの設定」も参照してください。

Adobe Experience Manager（AEM）のコンテンツフラグメントは、ページに依存しないアセットとして作成および管理されます。コンテンツフラグメントを使用すると、チャネルに特化しないコンテンツをチャネル固有のバリエーションと共に作成できます。その後、コンテンツページを作成する際に、これらのフラグメントとそのバリエーションを使用できます。また、既存のコンテンツフラグメントアセットを使用するには、アセットブラウザーからページにドラッグします（基礎コンポーネントの画像など、他のアセットベースのコンポーネントに対して）。既製のコンテンツフラグメントコンポーネントには、参照されているコンテンツフラグメントの要素が 1 つだけ表示されます。コンポーネントダイアログを使用して、ページに表示する要素、バリエーション、フラグメントの段落の範囲を定義できます。

メモ

このコンテンツフラグメントコンポーネントは、廃止された記事コンポーネントの強化版として AEM 6.2 で導入されました。

メモ

コンテンツフラグメントは、クラシック UI ではサポートされません。

定義

コンテンツフラグメントコンポーネントは、コンテンツフラグメントアセット（効果的に拡張されたテキストアセット）への参照を保持するために使用されます。コンテンツフラグメントのリソースタイプは次のとおりです。

dam/cfm/components/contentfragment/contentfragment

参照を定義するには、次のプロパティを使用します。

fileReference

タッチ操作対応 UI のエディターのみ、コンテンツフラグメントコンポーネントを完全にサポートします。これには、次のクライアントライブラリが含まれます。

cq.authoring.editor.plugin.cfm

このライブラリは、コンテンツフラグメント専用の機能をエディターに追加します。例えば、ページ上のコンテンツフラグメントの追加および設定機能のサポート、アセットブラウザーでのコンテンツフラグメントアセットの検索機能およびサイドパネルでの関連コンテンツの検索機能を使用できます。

中間コンテンツ

コンテンツフラグメントコンポーネントを使用すると、表示される要素のさまざまな段落の間に追加コンポーネントを挿入できます。基本的に、表示される要素は様々な段落で構成されます（各段落はキャリッジリターンによってマークされます）。これらの段落の間に、他のコンポーネントを使用してコンテンツを挿入できます。

技術的な観点から、表示された要素の各段落*はそれぞれ独自のparsysに存在し、段落間に追加する各コンポーネントはparsysに挿入されます（フードの下）。

言い換えると、コンテンツフラグメントコンポーネントのインスタンスが 3 つの段落で構成されている場合、コンポーネントはリポジトリ内に 3 つの異なる parsys を持ちます。コンテンツフラグメントに追加される中間コンテンツはすべて、実際にはこれらの parsys の内部に配置されます。

リポジトリ内では、中間コンテンツは全体の段落構造内での自身の位置を基準として格納されます。実際の段落コンテンツに付加されるわけではありません。

この仕組みを理解するために、次のような状況を考えてみましょう。

コンテンツフラグメントのインスタンスが 3 つの段落で構成されている
2 番目の段落の後に、既にいくつかのコンテンツが挿入されている
- この場合、コンテンツは 2 番目の parsys に格納されます。

基本的に、このインスタンスの段落構造を変更した場合は（表示される段落のバリエーション、要素または範囲を変更するなど）、表示される中間コンテンツに影響が及びます。例えば次の場合が考えられます。

コンテンツフラグメントコンポーネントが編集され、2 番目の段落の前に別の段落が追加される：
- 中間コンテンツは、新規作成された段落の後に表示されます（2 番目の parsys が新規作成された段落を保持するようになります）。
コンテンツフラグメントコンポーネントが編集され、2 番目の段落が削除される：
- 中間コンテンツは、以前は 3 番目だった段落の後に表示されます（2 番目の parsys が、以前は 3 番目だった段落を保持するようになります）。
最初の段落だけを表示するようにコンテンツフラグメントコンポーネントが設定される：
- 中間コンテンツは表示されなくなります（新しい設定によって、2 番目の parsys はレンダリングされなくなります）。

コンテンツフラグメントコンポーネントのカスタマイズ

既製のコンテンツフラグメントコンポーネントを拡張のブループリントとして使用するときは、次のルールを守ってください。

HTL レンダリングスクリプトと関連 POJO を再利用して、中間コンテンツ機能の実装方法を確認します。
コンテンツフラグメントノードの再利用：cq:editConfig
- afterinsert/ afteredit/ afterdeleteリスナーは、JSイベントのトリガーに使用されます。これらのイベントを cq.authoring.editor.plugin.cfm クライアントライブラリで処理して、関連コンテンツをサイドパネルに表示します。
- コンテンツフラグメントアセットのドラッグをサポートするように cq:dropTargets を設定します。
- ページエディターでコンテンツフラグメントのオーサリングをサポートするように cq:inplaceEditing を設定します。フラグメントのインプレースエディターは cq.authoring.editor.plugin.cfm クライアントライブラリで定義され、クイックリンクによって現在の要素／バリエーションをフラグメントエディターで開けるようにします。

レンダリング前のアセットの書き直し

コンテンツフラグメント管理では、初期レンダリング処理を使用してページの最終的な HTML 出力を生成します。これは、コンテンツフラグメントコンポーネントによって内部で使用されますが、参照ページ上の参照フラグメントを更新するバックグラウンド処理でも使用されます。

内部では、このレンダリングに Sling Rewriter を使用します。それぞれの設定は/libs/dam/config/rewriter/cfmにあり、必要に応じて調整できます。詳しくは、Apache Slingリライターを参照してください。

既成の設定は、次の変換サービスを使用します。

transformer-cfm-payloadfilter — フラグメントのHTMLの body 一部( <body>...</body>)のみを取得する場合
transformer-cfm-parfilter - 段落範囲が指定されている場合に、不要な段落を除外します（コンテンツフラグメントコンポーネントで実行可能）
transformer-cfm-assetprocessor - フラグメントに埋め込まれたアセットのリストを取得するために内部で使用されます

レンダリング処理は com.adobe.cq.dam.cfm.content.FragmentRenderService を通じて公開され、必要に応じて、（例えば）カスタムコンポーネントによって活用されます。