コンテンツフラグメントコンポーネント content-fragment-component
コアコンポーネントのコンテンツフラグメントコンポーネントを使用すれば、コンテンツフラグメントを表示できます。
使用方法 usage
コアコンポーネントのコンテンツフラグメントコンポーネントを使用すれば、コンテンツフラグメントをページに組み込むことができます。
- フラグメントとそのプロパティは、設定ダイアログで選択できます。
- 特定の画像やグリッドを処理するリソースタイプは、デザインダイアログで定義できます。
- 編集オプションを選択すると、選択したフラグメントがコンテンツフラグメントエディター内で開きます。
バージョンと互換性 version-and-compatibility
このドキュメントでは、コンテンツフラグメントコンポーネントの現在のバージョン(2017年10月にコアコンポーネントのリリース 1.1.0 で導入された v1)について説明します。
コンポーネントのすべてのサポート対象バージョン、コンポーネントの各バージョンと互換性のある AEM バージョン、以前のバージョンのドキュメントへのリンクを次の表に示します。
apps/core/wcm/extension/components/contentfragment/v1/contentfragment
apps/core/wcm/components/contentfragment/v1/contentfragment
コアコンポーネントのバージョンとリリースについて詳しくは、コアコンポーネントのバージョンを参照してください。
コンポーネント出力のサンプル sample-component-output
コンテンツフラグメントコンポーネントを体験し、その設定オプションや HTML および JSON 出力の例を確認するには、コンポーネントライブラリを参照してください。
技術的詳細 technical-details
コンテンツフラグメントコンポーネントに関する最新の技術ドキュメントについては、GitHub を参照してください。
コアコンポーネントの開発について詳しくは、コアコンポーネント開発者向けドキュメントを参照してください。
設定ダイアログ configure-dialog
設定ダイアログでは、コンテンツフラグメントとそのフラグメントを組み込む要素をコンテンツ作成者が定義できます。
「プロパティ」タブ properties-tab
-
コンテンツフラグメント
- 目的のコンテンツフラグメントへのパス
- 選択ダイアログ を使用して、フラグメントを見つけることができます。
-
ディスプレイモード
- 単一のテキスト要素 - 複数行テキスト要素を 1 つ選択でき、段落コントロールオプションを有効にします。
- 複数の要素 - 選択したコンテンツフラグメントの複数の要素を選択できます。
-
エレメント - コンテンツフラグメントを組み込む要素
-
バリエーション - 使用するコンテンツフラグメントのバリエーション(デフォルトは マスター)
-
段落
-
すべて - すべての段落を表示します
-
範囲
- 表示する段落の範囲をセミコロンで区切って指定します
- 例えば、
1;3-5;7;9-*
では、1 番目、3 番目から 5 番目まで、7 番目、9 番目が最終的な段落に含まれます。
-
-
ID - このオプションを使用すると、HTML 内およびデータレイヤー内のコンポーネントの一意の識別子を制御できます。
- 空白のままにした場合、一意の ID が自動的に生成されます。生成された ID は結果のページを調べることで確認できます。
- ID を指定した場合、作者はその ID が一意であることを確認する必要があります。
- ID を変更すると、CSS、JS、およびデータレイヤーのトラッキングに影響を与える可能性があります。
「段落制御」タブ paragraph-control-tab
複数の要素 モードが選択されている場合は、このタブを使用できません。
- 段落 - すべての段落、または特定の範囲を選択できます。
- 見出しを独自の段落として処理
デザインダイアログ design-dialog
デザインダイアログでは、混在メディア画像とレスポンシブグリッドを処理するためのリソースタイプをテンプレート作成者が定義できます。
-
内部レスポンシブグリッド
- 内部レスポンシブグリッドに使用される Sling リソースタイプ
Adobe Client Data Layer data-layer
コンテンツフラグメントコンポーネントは、Adobe Client Data Layer をサポートしています。