カスタムアダプティブフォームのテンプレートの作成 creating-a-custom-adaptive-form-template

オーサーインスタンスで CRXDE Lite に移動します。

/apps ディレクトリの下に、自分のアプリケーションのフォルダー構造を作成します。例えば、アプリケーションの名前が mycompany の場合、その名前のフォルダーを作成します。通常、アプリケーションフォルダーには components、configuration、templates、src、installation のディレクトリが含まれます。この例では、components、configuration、templates の各フォルダーを作成します。

/libs/fd/af/templates フォルダーに移動します。

simpleEnrollmentTemplate ノードをコピーします。

/apps/mycompany/templates フォルダーに移動します。右クリックして「ペースト」を選択します。

必要に応じて、コピーしたテンプレートノードの名前を変更します。例えば、enrollment-template などに変更します。

/apps/mycompany/templates/enrollment-template に移動します。

jcr:content ノードの jcr:title プロパティと jcr:description プロパティを変更し、コピー元のテンプレートと区別できるようにします。

変更したテンプレートの jcr:content ノードには、guideContainer と guideformtitle のコンポーネントが含まれます。guideContainer はアダプティブフォームを格納するコンテナです。guideformtitle コンポーネントは、アプリケーション名や説明などを表示します。

guideformtitle の代わりに、カスタムコンポーネントまたは parsys コンポーネントを含めることができます。例えば、guideformtitle を削除して、カスタムコンポーネントまたは parsys コンポーネントのノードを含めることができます。コンポーネントの sling:resourceType プロパティの参照先が、そのコンポーネントになっていることを確認してください。ページ component.jsp ファイルでも同様に定義されます。

/apps/mycompany/templates/enrollment-template/jcr:content に移動します。

「プロパティ」タブを開き、cq:designPath プロパティの値を /etc/designs/mycompany に変更します。

次に、cq:Page タイプに /etc/designs/mycompany のノードを作成します。

/apps/mycompany/templates/enrollment-template/jcr:content のノードに移動し、sling:resourceType プロパティの値を /apps/mycompany/components/page/enrollmentpage に変更します。

/libs/fd/af/components/page/base のノードを /apps/mycompany/components/page フォルダーにコピーします。

コピーしたコンポーネントの名前を enrollmentpage に変更します。

（コンテンツページをすでに持っている場合に限ります） 自分の web サイトに contentpage コンポーネントがすでに存在する場合、次の手順（a-d）を実行します。自分の web サイトに contentpage コンポーネントが存在しない場合は、resourceSuperType プロパティを標準の基本ページにポイントしたままにすることができます。

1. enrollmentpage ノードの場合、sling:resourceSuperType プロパティの値を mycompany/components/page/contentpage に設定します。contentpage コンポーネントは、自分のサイトの基本ページコンポーネントです。他のページコンポーネントで拡張することができます。enrollmentpage の下で、head.jsp、content.jsp、library.jsp を除くスクリプトファイルを削除します。このケースでは contentpage である sling:resourceSuperType コンポーネントに、このようなスクリプトすべてが含まれます。ナビゲーションバーやフッターなどを含むヘッダー類は、contentpage コンポーネントから継承されます。

2. head.jsp ファイルを開きます。

   この JSP ファイルには <cq.include script="library.jsp"/> 行が含まれます。

   library.jsp ファイルには、guide.theme.simpleEnrollment のクライアントライブラリが含まれ、その中にアダプティブフォームのスタイル設定が含まれています。

   enrollmentpage のページコンポーネントは専用の head.jsp ファイルがあり、contentpage コンポーネントの head.jsp ファイルをオーバーライドします。

3. enrollmentpage コンポーネント用の head.jsp ファイルに、contentpage コンポーネント用の head.jsp ファイルのすべてのスクリプトを含めます。

4. content.jsp スクリプトの中に、追加のページコンテンツまたはページがレンダリングされる際に含まれる他のコンポーネントへの参照を追加することができます。例えば、applicationformheader カスタムコンポーネントを追加する場合、JSP ファイルのコンポーネントに次の参照を追加します。

   <cq:include path="applicationformheader" resourceType="mycompany/components/applicationformheader"/>

   同様に、テンプレートのノード構造に parsys コンポーネントを追加する場合、カスタムコンポーネントも含めます。