ページテンプレート - 静的

テンプレートは、ページの作成に使用され、選択した範囲内で使用できるコンポーネントを定義します。テンプレートは、そこから作成されるページと同じ構造を持つノードの階層ですが、実際のコンテンツは含みません。

各テンプレートには、使用可能なコンポーネントが表示されます。

テンプレートはコンポーネント;
コンポーネントはウィジェットを使用し、ウィジェットにアクセスできます。ウィジェットはコンテンツのレンダリングに使用されます。

メモ

編集可能なテンプレートも使用できますが、これは最も柔軟性が高く、最新の機能を実現するために推奨されるタイプのテンプレートです。

テンプレートのプロパティと子ノード

テンプレートは、タイプが cq:Template のノードで、次のプロパティと子ノードを持ちます。

名前	種類	説明
.	cq:Template	現在のテンプレートです。テンプレートのノードタイプは cq:Template です。
allowedChildren	String[]	このテンプレートの子となることが許可されているテンプレートのパス。
allowedParents	String[]	このテンプレートの親となることが許可されているテンプレートのパス。
allowedPaths	String[]	このテンプレートをベースとすることが許可されているページのパス。
jcr:created	日付	テンプレートの作成日。
jcr :description	文字列	テンプレートの説明。
jcr:title	文字列	テンプレートのタイトル。
ranking	Long	テンプレートのランクです。ユーザーインターフェイスにテンプレートを表示する際に使用します。
jcr:content	cq:PageContent	テンプレートのコンテンツを含むノード。
thumbnail.png	nt:file	テンプレートのサムネール。
icon.png	nt:file	テンプレートのアイコン。

テンプレートは、ページの基盤です。

ページを作成するには、テンプレート（ノードツリー /apps/<myapp>/template/<mytemplate>）をサイトツリーの対応する位置にコピーする必要があります。「Web サイト」タブを使用してページを作成する場合も、この処理がおこなわれています。

また、このコピーアクションは、ページの初期コンテンツ（通常はトップレベルコンテンツのみ）と、ページのレンダリングに使用されるページコンポーネントのパス（子ノード jcr:content 内のすべて）を示す sling:resourceType プロパティも提供します。

テンプレートの構造

考慮すべき 2 つの側面があります。

テンプレート自体の構造
テンプレートを使用する際に作成されるコンテンツの構造

テンプレートの構造

テンプレートは、タイプのノードの下に作成されます cq:Template.

screen_shot_2012-02-13at63646pm

特に、様々なプロパティを設定できます。

jcr:title — テンプレートのタイトル。は、ページの作成時にダイアログに表示されます。
jcr:description — テンプレートの説明。は、ページの作成時にダイアログに表示されます。

このノードには、結果ページのコンテンツノードの基礎として使用される jcr:content(cq:PageContent) ノードが含まれます。これは、sling:resourceType を使用して、新しいページの実際のコンテンツのレンダリングに使用されるコンポーネントを参照します。

screen_shot_2012-02-13at64010pm

このコンポーネントは、新しいページを作成する際に、コンテンツの構造およびデザインを定義するために使用します。

screen_shot_2012-02-13at64137pm

テンプレートによって作成されるコンテンツ

テンプレートは、cq:Page タイプのページを作成するのに使用します（前述のように、ページは特別なタイプのコンポーネントです）。各 AEM ページには構造化ノード jcr:content があります。この特徴は次のとおりです。

タイプが cq:PageContent の場合
は、定義された content-definition を保持する構造化ノードタイプです
コンテンツのレンダリングに使用する Sling スクリプトを保持するコンポーネントを参照するための sling:resourceType プロパティを持つ。

デフォルトのテンプレート

AEMには、すぐに使用できる様々なデフォルトテンプレートが付属しています。場合によっては、テンプレートをそのまま使用することもできます。その場合は、テンプレートが Web サイトで使用できることを確認する必要があります。

例えば、AEMには、コンテンツページやホームページを含む複数のテンプレートが付属しています。

タイトル	コンポーネント	場所	目的
ホームページ	homepage	geometrixx	Geometrixxのホームページテンプレート。
コンテンツのページ	contentpage	geometrixx	Geometrixxコンテンツページテンプレート。

デフォルトのテンプレートの表示

リポジトリ内のすべてのテンプレートのリストを表示するには、次の手順を実行します。

CRXDE Liteで、 ツール メニューとクリック クエリ.
「クエリ」タブで、
形式 タイプを選択します。 XPath.
内 クエリ 入力フィールドに次の文字列を入力します。//element(*, cq:Template)
クリック実行. 結果ボックスにリストが表示されます。

通常は、既存のテンプレートを使用し、独自のテンプレート用に新しいテンプレートを開発します。詳しくは、ページテンプレートの開発を参照してください。

既存のテンプレートを各自の web サイト用に有効にし、web サイトコンソールから「Web サイト」のすぐ下にページを作成するときにページを作成ダイアログにそのテンプレートを表示する場合は、テンプレートノードの allowedPaths プロパティを次のように設定します。/content(/.&?lang=ja#42;)?

テンプレートデザインの適用方法

UI でスタイルがデザインモードを使用して定義されている場合、デザインは、スタイルが定義されているコンテンツノードの正確なパスに保持されます。

注意

Adobeでは、デザインモードを介してのみデザインを適用することをお勧めします。

例えば、CRXDE Liteでのデザインの変更はベストプラクティスではなく、そのようなデザインの適用は期待される動作とは異なる場合があります。

デザインがデザインモードを使用してのみ適用される場合、次のセクションは、デザインパスの解像度、デシジョンツリー、および例は適用されません。

デザインパスの解像度

静的テンプレートに基づいてコンテンツをレンダリングする場合、AEMは、コンテンツ階層のトラバーサルに基づいて、最も関連性の高いデザインとスタイルをコンテンツに適用しようとします。

AEM は次の順序で、コンテンツノードに最も関連性の高いスタイルを決定します。

（デザインモードでデザインが定義されている場合と同様に）コンテンツノードのフルパスと正確なパスのデザインがある場合には、そのデザインを使用します。
親のコンテンツノードにデザインがある場合は、そのデザインを使用します。
コンテンツノードのパス上に任意のノードのデザインがある場合は、そのデザインを使用します。

最後の 2 つのケースで、適用可能なデザインが複数ある場合は、コンテンツノードに最も近いものを使用します。

デシジョンツリー

これはデザインパスの解像度を図で表現したものです。

design_path_resolution

例

デザインを任意のノードに適用できる場合、シンプルなコンテンツ構造を次のように考えてみます。

/root/branch/leaf

次の表に、AEMによるデザインの選択方法を示します。

デザインの検索	存在するデザイン	選択したデザイン	コメント
`leaf`	`root` `branch` `leaf`	`leaf`	最も正確に一致するものが常に取得されます。
`leaf`	`root` `branch`	`branch`	ツリー下部の最も近いマッチにフォールバックします。
`leaf`	`root`	`root`	他のすべてが失敗した場合は、残りのものを取得します。
`branch`	`branch`	`branch`
`branch`	`branch` `leaf`	`branch`
`branch`	`root` `branch`	`branch`
`branch`	`root` `leaf`	`root`	完全に一致しない場合は、ツリーの 1 つ下のものを選択します。これは常に適用できるが、ツリーの上の方は具体的すぎる可能性があると仮定します。

ページテンプレートの開発

AEMのページテンプレートは、ページの作成に使用される単純なモデルです。コンテンツには、正しい初期ノード構造を作成する役割を持つ初期コンテンツを必要に応じて最小限に、または必要に応じて最大限含めることができます。必要なプロパティ（主に sling:resourceType）は、編集とレンダリングを許可するように設定されます。

テンプレートの作成（既存のテンプレートに基づく）

新しいテンプレートはゼロから完全に作成できますが、多くの場合、既存のテンプレートがコピーされ、時間と労力を節約するために更新されます。例えば、テンプレートをGeometrixx内で使用して作業を開始できます。

既存のテンプレートに基づいてテンプレートを作成するには：

既存のテンプレート（できれば目的の定義にできるだけ近い定義を持つ）を新しいノードにコピーします。

テンプレートは、 /apps/<website-name>/templates/<template-name>.

メモ

使用可能なテンプレートのリストは、新しいページの場所と、各テンプレートで指定されている配置制限によって異なります。詳しくは、 Template Availability.
を jcr:title 新しい役割を反映する新しいテンプレートノードを作成します。また、 jcr:description 必要に応じて。ページの使用可能なテンプレートを必要に応じて変更してください。

メモ

Web サイト コンソールから Web サイト のすぐ下にページを作成するときに ページを作成 ダイアログにテンプレートを表示する場合は、 allowedPathsテンプレートノードのプロパティを、/content(/.*)?に設定します。
テンプレートの基になるコンポーネントをコピーします ( これは sling:resourceType プロパティ jcr:content ノードを使用して ) インスタンスを作成します。

コンポーネントは、に格納されます。 /apps/<website-name>/components/<component-name>.
を更新します。 jcr:title および jcr:description 新しいコンポーネントの
新しいサムネール画像をテンプレート選択リストに表示する場合は、thumbnail.png を置き換えます（サイズ 128 x 98 px）。
を更新します。 sling:resourceType テンプレートの jcr:content 新しいコンポーネントを参照するノード。
テンプレートの機能やデザイン、基になるコンポーネント、またはその両方に追加の変更を加えます。

メモ

変更： /apps/<website>/templates/<template-name> ノードは、（選択リストのように）テンプレートインスタンスに影響を与えます。

変更： /apps/<website>/components/<component-name> ノードは、テンプレートを使用する際に作成されるコンテンツページに影響を与えます。

これで、新しいテンプレートを使用して、Web サイト内にページを作成できます。

メモ

エディタークライアントライブラリは、 cq.shared コンテンツページの名前空間。存在しない場合は JavaScript エラー。 Uncaught TypeError: Cannot read property 'shared' of undefined 結果。

すべてのサンプルコンテンツページには cq.shared が含まれているので、それらをベースとするコンテンツには自動的に cq.shared が含められます。ただし、サンプルコンテンツをベースとせず、ゼロから独自のコンテンツページを作成する場合は、cq.shared 名前空間を含める必要があります。

詳しくは、クライアントサイドライブラリの使用を参照してください。

既存のテンプレートを使用可能にする

この例では、特定のコンテンツパスに対してテンプレートを使用する方法を示します。ページ作成者がページの作成時に使用できるテンプレートは、 Template Availability.

CRXDE Lite で、ページに使用するテンプレート（ニュースレターテンプレートなど）に移動します。
を allowedPaths プロパティおよび使用する他のプロパティテンプレートの可用性. 例えば allowedPaths: /content/geometrixx-outdoors/[^/]+(/.*)? は、このテンプレートが /content/geometrixx-outdoors 以下の任意のパスで許可されることを意味します。