ページテンプレート page-templates
この章では、ページテンプレートとページの関係を探ります。スタイル設定されていない Magazine Article テンプレートを AdobeXD のモックアップを基に作成します。テンプレートを作成するプロセスでは、コアコンポーネントと詳細ポリシー設定について説明します。
前提条件 prerequisites
これはマルチパートチュートリアルであり、コンテンツの作成と変更の公開の章で大まかに説明されている手順が完了していることを前提としています。
目的
- ページテンプレートの詳細と、ポリシーを使用してページコンテンツのきめ細かい制御を実施する方法を理解します。
- テンプレートとページのリンク方法を学びます。
- 新しいテンプレートを作成し、ページをオーサリングします。
作成する内容 what-you-will-build
チュートリアルのこのパートでは、新しい雑誌記事の作成に使用でき共通の構造に沿う新しい Magazine Article Page テンプレートを作成します。このテンプレートは、AdobeXD で生成されたデザインと UI キットに基づいています。この章では、テンプレートの構造またはスケルトンの構築にのみ焦点を当てています。スタイルは実装されていませんが、テンプレートとページは機能しています。
Magazine Article Page テンプレートの作成
ページを作成する際には、新しいページを作成するためのベースとして使用されるテンプレートを選択する必要があります。テンプレートでは、結果として作成されるページの構造、初期コンテンツおよび許可されたコンポーネントを定義します。
ページテンプレートには、主な領域が次の 3 つあります。
- 構造 - テンプレートの一部であるコンポーネントを定義します。コンテンツ作成者はこれらを編集できません。
- 初期コンテンツ - テンプレートの出発点となるコンポーネントを定義します。これは、コンテンツ作成者が編集または削除できます。
- ポリシー - コンポーネントの動作、および作成者が利用可能なオプションに関する設定を定義します。
次に、モックアップの構造に合致する新しいテンプレートを AEM で作成します。これは、AEM のローカルインスタンスで行います。以下のビデオで示す手順に従います。
次のサムネールを使用して、テンプレートを特定できます（または独自のテンプレートをアップロードできます）。
ソリューションパッケージ
完成済みの Magazine テンプレートソリューションをパッケージマネージャーでダウンロードしてインストールできます。
エクスペリエンスフラグメントを使用したヘッダーとフッターの更新 experience-fragments
ヘッダーやフッターなどのグローバルコンテンツを作成する際の一般的な方法は、エクスペリエンスフラグメントを使用することです。エクスペリエンスフラグメントを使用すると、複数のコンポーネントを組み合わせて、1 つの参照可能なコンポーネントを作成できます。エクスペリエンスフラグメントには、マルチサイト管理とローカリゼーションをサポートするという利点があります。
Site テンプレートから、ヘッダーとフッターが生成されました。次に、モックアップと一致するようにエクスペリエンスフラグメントを更新します。以下のビデオの手順に従います。
ビデオの大まかな手順は次のとおりです。
- サンプルのコンテンツパッケージ WKND-Starter-Assets-Skate-Article-1.2.zip をダウンロードします。
- パッケージマネージャーを使用して、このコンテンツパッケージをアップロードしインストールします。
- WKND ロゴを使用するように、ヘッダーとフッターのエクスペリエンスフラグメントを更新します。
雑誌記事ページの作成
次に、Magazine Article Page テンプレートを使用して新しいページを作成します。サイトのモックアップと一致するようにページのコンテンツを作成します。以下のビデオの手順に従います。
用意されているテキストを記事の本文に入力します。
おめでとうございます。 congratulations
これで、Adobe Experience Manager Sites で新しいテンプレートとページを作成しました。
次の手順 next-steps
現時点では、雑誌記事ページおよびサイトは WKND のブランドスタイルと一致しません。テーマ設定チュートリアルに従って、サイトにグローバルスタイルを適用するための CSS と Javascript フロントエンドコードの更新に関するベストプラクティスを説明します。
ソリューションパッケージ
この章のダウンロード可能なソリューションパッケージは、WKND-Magazine-Template-SOLUTION-1.0.zip です。