サイトテーマ site-themes
TIP
AEM 向け Edge Delivery Services について検討したことはありますか？
既存のプロジェクトでは、このドキュメントで説明されている方法を引き続き使用できます。ただし、新規プロジェクトの場合は、Edge Delivery Services を利用することをお勧めします
AEM サイトテーマを使用して、公開配信を使用した従来の AEM オーサリングプロジェクトのサイトのスタイルとデザインをカスタマイズする方法について説明します。
概要 overview
AEM サイトテーマは、AEM サイトのスタイルを定義し、AEM サイトテーマの構造に準拠する CSS、JavaScript および静的リソースを含むパッケージです。
AEM サイトテンプレートを使用して作成したサイトでは、公開配信を使用した従来の AEM オーサリングプロジェクトのテーマを簡単にダウンロード、カスタマイズ、再デプロイできます。
NOTE
AEM サイトテーマを AEM サイトテンプレートと混同しないでください。 AEM サイトテーマには、AEM サイトのスタイル設定情報のみが含まれています。AEM サイトテンプレートは、サイト構造と初期コンテンツを定義し、クイックサイト作成を可能にする AEM サイトテーマを含んでいます。
サイトテーマの使用 using-themes
サイトテーマは、次の 2 つの方法で使用されます。
- これらは、 サイトの作成 時にスタイル設定を定義するためのサイトテンプレートの一部として使用されます。
- これらは、サイトテンプレートに基づいてサイトを作成した後にダウンロードされるので、フロントエンド開発者はスタイル設定をさらにカスタマイズできます。
TIP
テンプレートからサイトを作成し、そのテーマをカスタマイズするプロセスのエンドツーエンドについては、 クイックサイト作成ジャーニー を参照してください。
サイトテーマの構造 structure
サイトテーマは、パッケージのコンテンツの目的を明確に反映した論理構造を持つ単純なパッケージです。一般的なフロントエンドプロジェクトの場合、アドビではサイトテーマに次の構造をお勧めします。
src/theme.ts：JS および CSS テーマのメインエントリポイントsrc/site：サイト全体に適用される JS および CSS ファイルsrc/components：AEM コンポーネント固有の JS および CSS ファイルsrc/resources：アイコン、ロゴ、フォントなどの静的ファイル
メインエントリポイント src/theme.ts が保持されている限り、特定のプロジェクトのニーズに応じて、テーマの構造は異なる場合があります。
標準のサイトテーマ standard-site-theme
アドビは、独自のテーマを作成する際の基礎として使用できる、ベストプラクティスの参照テーマを提供します。標準のサイトテーマは GitHub で入手できます。
サイトテーマの開発 developing-themes
アドビは、新しいサイトテーマを作成するための一連のスクリプトとして AEM Site Theme Builder を提供します。
AEM Site Theme Builder は、GitHub の使用方法ドキュメントと共に利用できます。 テーマをカスタマイズするには、フロントエンド開発エクスペリエンスが必要です。
recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab