コアコンポーネントを使用したオーサリング

Adobe Experience Manager では、コンポーネントは、オーサリングするページのコンテンツを構成する構造要素です。

コアコンポーネントは、柔軟で機能豊富なオーサリング機能を提供します。WKND リファレンスサイトとその説明は、リッチな web サイトエクスペリエンスを実装するためのコアコンポーネントの使用方法を示します。

コアコンポーネントを体験したり、それらの設定オプションの例や、HTML 出力や JSON 出力の例を確認したりするには、コンポーネントライブラリにアクセスしてください。

AEM プロジェクトアーキタイプを使用して AEM プロジェクトにコアコンポーネントを実装するための開発者向けの詳しい概要については、WKND チュートリアルを参照してください。

メモ

コアコンポーネントは、作成者がすぐに使用できるわけではありません。最初に開発チームがお使いの環境に統合する必要があります。統合されると、テンプレートエディターで使用できるようになり、事前設定されます。

注意

コアコンポーネントでは AEM 6.4 以降が必要です。また、編集可能テンプレートを使用する必要があります。コアコンポーネントはクラシック UI や静的テンプレートでは動作しません。

コアコンポーネントを使用したオーサリング

作成者には、次のようなコアコンポーネントのメリットがあります。

コンポーネントは、ページ編集​の際に、ページエディターのサイドパネルの「コンポーネント」タブから利用できます。

コンポーネントは、フィルタリングや整理を容易に行えるよう、コンポーネントグループと呼ばれるカテゴリに従ってグループ化されます。コンポーネントのグループ名は、コンポーネントブラウザーにコンポーネントと共に表示されます。また、正しいコンポーネントを簡単に見つけられるように、グループでフィルタリングすることもできます。

メモ

コアコンポーネントは、デフォルトでは非表示グループの一部になっているので、コンポーネントブラウザー内には表示されません。

必要なコンポーネントを表示グループに追加するか、カスタマイズすると、作成者が使用できるようになります。

コアコンポーネントの事前設定

以前、基盤コンポーネントの設定は、開発者の仕事でした。これに対し、コアコンポーネントでは、テンプレート作成者がテンプレートエディター経由で様々な機能を設定できるようになりました。

例えば、画像コンポーネントでファイルシステムからの画像アップロードを許可しない場合や、テキストコンポーネントで特定の段落フォーマットのみを許可する場合は、クリックするだけでそれらの機能の有効／無効を切り替えることができます。

詳しくは、ページテンプレートの作成を参照してください。

編集ダイアログとデザインダイアログ

コアコンポーネントでは、テンプレート作成者がテンプレートの一部として使用できるオプションを定義することでコアコンポーネントを事前設定した後、ページ作成者がさらに設定することで実際のページコンテンツを定義できます。これにより、各コンポーネントで、異なる 2 つのダイアログ内にオプションが存在することがあります。

説明 制御対象 例
編集ダイアログ ページ作成者​が通常のページ編集中に、配置したコンポーネントに対して変更できるオプション コンポーネントによって表示されるコンテンツや、そのコンテンツが最終的にページ上でどのように表示されるか。 コンテンツテキストの書式設定、ページ上の画像の回転
デザインダイアログ テンプレート作成者​がページテンプレートの設定時に変更できるオプション。 ページ作成者がコンポーネント編集時に利用できるオプション 利用可能なテキスト書式設定オプション、利用可能な画像インプレースオプション

コンポーネントのスタイル設定

ほとんどのコアコンポーネントのスタイルは、AEM スタイルシステムを使用して定義できます。

  • テンプレート作成者は、特定のコンポーネントで利用可能なスタイルを、そのコンポーネントのデザインダイアログで定義できます。
  • その後、コンテンツ作成者は、コンポーネントを追加してコンテンツを作成する際に、適用するスタイルを選択できます。

詳しくは、スタイルシステムのドキュメントを参照してください。

開発者リソース

コアコンポーネントに関する技術情報については、開発者向けのドキュメントのコアコンポーネントの開発を参照してください。

このページ