フォームポータルページの作成

フォームポータルのコンポーネントでは、Web開発者にAdobe Experience Manager (AEM)を使用してフォームポータル用Webサイトを作成し、カスタマイズするためのコンポーネントが用意されています。フォームポータルの概要については、「ポータル上でフォームを発行する」を参照してください。

前提条件

デフォルトでは、フォームポータルコンポーネントは使用できません。「フォームポータルのコンポーネントを有効にする」の説明に従い、フォームポータルコンポーネントにおける次のカテゴリが有効になっていることを確認してください。

Document Services：検索とリスター、リンクおよびドラフトと送信のコンポーネントが含まれています。

Document Services Predicates：「Date Predicate」、「Full Text Predicate」、「Properties Predicate」、および「Tags Predicate」のコンポーネントが含まれています。これらのコンポーネントは、「Search & Lister」コンポーネントで検索を設定する際に使用します。

これらをAEMサイトのページで有効にすると、コンポーネントの各カテゴリはコンポーネントブラウザで使用でるようになります。

Formsポータルコンポーネントのカテゴリ

Search & Listerコンポーネント

「Document Services」のコンポーネントカテゴリにある「Search & Lister」コンポーネントは、ページ上にフォームを一覧表示し、その中から検索を実行するのに使用されます。コンポーネントには、次の2つのペインが含まれます。

• フォームが一覧表示される「リスト」ペイン。
• 検索機能を追加する「検索」ペイン。

検索とリスターコンポーネントは、コンポーネントブラウザの Document Services コンポーネントカテゴリからページまでドラッグ＆ドロップすることができます。コンポーネントを追加すると、下記の画像のようになります。

ページ中のグリッドレイアウトのSearch & Lister コンポーネント

「リスト」ペイン

リストペインはフォームが一覧表示される領域です。検索とリスターコンポーネントでは各種の設定オプションが提供されており、リストウィンドウでフォームの表示を制御するのに使用します。

リストウィンドウを設定するには、検索とリスターコンポーネントをタップし、 をタップします。編集コンポーネント​ダイアログが開きます。

編集モードのリストペイン

「編集」ダイアログには複数のタブが含まれており、以下の表で説明される設定オプションを提供します。終わったら「OK」をタップして、設定を保存します。

タブ	設定	説明
アセットフォルダー	項目を追加	アセットのアップロード先フォルダーを、AEM FormsのUIから設定します。デフォルトでは、アップロードされたすべてのアセットが一覧表示されます。AEM Forms の UI に関する詳細は、「フォーム管理の概要」を参照してください。
ディスプレイ	タイトルテキスト	Search & Listerコンポーネントのタイトルデフォルトのタイトルはフォームポータルです。
	テンプレートのレイアウト	アセットのレイアウト
	詳細検索の無効化	このオプションを有効にすると、詳細検索アイコンが非表示になります。
	テキスト検索の無効化	このオプションを有効にすると、全文検索バーが非表示になります。
結果	ページごとの結果の数	ページに表示するフォームの最大数を設定します。
	結果のテキスト	結果のテキストを設定します（例えば、1-12/601の「結果」）。デフォルト値は「Results」です。 例えば、このフィールドでフォームを指定し、合計 601 のフォームがある場合、結果のテキストは 1-12/601 の「Forms」に変わります。
	ページテキスト	ページテキストを設定します（例：1/51 ページ）。デフォルト値は「ページ」です。 例えば、このフィールドにアプリケーションフォームを指定し、ページが 51 ページある場合、ページテキストは 1/51 アプリケーションフォームに変わります。
	/ テキスト	指定されたテキストの of という文字を指定したテキストに置き換えます（Page 1 of 51）。デフォルト値は / です。 例えば、このフィールドに out of を指定した場合、テキストは Page 1 out of 51 に変わります。
フォームリンク	レンダリングタイプ	指定したレンダリングタイプに基づいて、フォームのリストをコントロールします。使用可能なオプションは「PDF」と「HTML」です。例えば、レンダリングタイプとして HTML のみを指定した場合は、PDF フォームが除外されます。
	HTML プロファイル	レンダリングに使用されるHTMLプロファイルを設定します。使用可能なすべてのプロファイルがドロップダウンリストに一覧表示されます。
	送信 URL	フォームデータが送信されるサーブレットを設定します。 注意：フォームの送信 URL は、複数の場所で指定できます。また、その優先順位は以下の通りです。 優先順位が最も高いのは、フォームに埋め込まれている送信URL（送信ボタン）です。 2番目に優先順位が高いのは、AEM Forms UIで説明している送信URLです。 一番優先順位が引くのが、フォームポータルで説明している送信URLです。
	HTMLレンダリングアクションのツールチップ	（HTML5のアイコン）の上にマウスを置くと表示されるツールチップのテキストを設定します。
	PDFレンダリングアクションのツールチップ	（PDF のアイコン）の上にマウスのポインターを置くと表示されるツールチップのテキストを設定します。
スタイル	スタイルタイプ	フォームのリスト表示には、書式なし、デフォルトスタイルまたはカスタムスタイルを指定できます。
	カスタムスタイルパス	スタイルタイプとして「カスタム」を選択した場合、カスタム CSS へのパスを参照して指定します。そうでない場合、「デフォルト」を選択します。

検索ペイン

検索ペインでは、サイドキックの「Document Services Predicates」カテゴリから、「Date Predicate」、「Full Text Predicate」、「Properties Predicate」、および「Tags Predicate」コンポーネントを追加することができます。これらのコンポーネントにより、一覧表示されるフォームに対してユーザーが検索を実行するための検索機能が実装されます。

チップ： フォームポータルに表示されるフォームのリストを既定の条件に基づいて制御し、エンドユーザーに対して検索機能を非表示にできます。フォームのリストを制御するには、検索フィルターを適用するためにPredicateコンポーネントを使用します。デフォルトフィルター値を指定して、コンポーネントの編集ダイアログの「表示」タブで検索を無効にすることもできます。

日付、フルテキスト、プロパティ、およびTags Predicate付きの検索パネル

日付の述語

「Date Predicate」コンポーネントが追加されている場合は、指定された期間に変更されたフォームについて、一覧表示されたフォームの中から検索できます。

「Date Predicate」コンポーネントを構成するには、次の手順を実行します。

1. コンポーネントをタップし、 をタップします。編集ダイアログが開きます。

2. 以下のプロパティを指定します。

   • タイプ：​選択できるオプションは「最終変更日」のみです。

   • テキスト： Date Predicateコンポーネントのラベルまたはキャプションです。デフォルト値は「最終変更日」です。

   • 開始日のラベル：​開始日フィールドのラベルまたはキャプションです。

   • 終了日のラベル：​終了日フィールドのラベルまたはキャプションです。

   • 非表示：​デフォルトの日付フィルターを適用してフォームを一覧表示します。

3. 「OK」をタップします。

フルテキストの述語

「Full Text Predicate」コンポーネントは、フォームデータに対して名前や説明などを検索する、フルテキスト検索を実装します。名前や説明にテキストを含む戻りフォームで、テキスト文字列を検索できます。

Full Text Predicate コンポーネントを構成するには、次の手順を実行します。

1. コンポーネントをタップし、 をタップします。編集ダイアログが開きます。
2. 「メインタイトル」フィールドにタイトルを指定します。
3. 「OK」をタップします。

プロパティの述語

Properties Predicateコンポーネントは、フォームプロパティ（タイトル、作成者および説明など）に基づいたフォームの検索機能を実装します。

Properties Predicate コンポーネントを構成するには、次の手順を実行します。

1. コンポーネントをタップし、 をタップします。編集ダイアログが開きます。

2. 「全般」タブで、検索ラベルを指定します。デフォルト値は、プロパティ​です。

3. 「オプション」タブで、「アイテムの追加」をタップします。

4. ドロップダウンリストからプロパティを選択し、ドロップダウンリストの下のフィールドでプロパティの検索ラベルを指定します。

5. 手順 4 を繰り返してさらにプロパティを追加します。デフォルトのフィルター値を指定して、指定の条件に基づいてフォームをリスト表示したり、エンドユーザーごとに検索のプロパティを非表示にしたりできます。プロパティの「非表示」チェックボックスを選択し、デフォルトフィルター値を指定します。例えば、タイトルに「Travel」という文字を含むフォームを表示するには、「タイトル」プロパティ横の「非表示」を選択します。さらに、デフォルトフィルター値のテキストボックスで Travel と指定します。

6. 「OK」をタップします。

タグの述語

Tags Predicate コンポーネントは、Forms Manager で定義されているタグに基づいて、フォームの検索機能を実装します。

Tags Predicate コンポーネントを構成するには、次の手順を実行します。

1. コンポーネントをタップし、 をタップします。編集ダイアログが開きます。
2. 「タグ」フィールド横の下向き矢印ボタンをタップします。
3. 適切なタグを選択します。
4. 「OK」をタップします。

選択したタグが、選択のためのチェックボックスと一緒に検索ペインに表示されます。ユーザーはこのタグに基づいて検索を絞り込めるようになります。

ページ上でフォームを一覧表示

ページ上でフォームを一覧表示するには、そのページに Search & Lister コンポーネントを追加し、リストペイン​を設定します。エンドユーザーが、日付、テキスト、およびタグでフォームを検索できるようにするには、検索ペイン​コンポーネントを追加します。

ページ上の任意の場所からフォームにリンクするには、リンクコンポーネントを使用します。リンクコンポーネントについての詳細は、「ページ内のリンクコンポーネントの埋め込み」を参照してください。

ドラフト状態で、既に送信済みのフォームをリストするには、「ドラフト&送信」コンポーネントを使用します。詳しくは、「ドラフト・送信コンポーネントのカスタマイズ」を参照してください。

モバイルデバイスへの適合性

フォームポータルのSearch & Listerコンポーネントは、モバイルデバイスフレンドリーで、デバイスに応じて表示幅を調整します。3 つすべてのデフォルトビュー：グリッド、カード、パネルは、web ページにも適応するという事実を踏まえて、デバイスに応じて再レイアウトされます。簡単に言えば、Search & Listerは単なるコンポーネントであり、ページレベルのスタイリングは管理しません。

次の画像は、モバイルデバイス上で開いた場合の Search & Lister コンポーネントを示します。

Search & Listerコンポーネント

フォームポータルページのカスタマイズ

フォームポータルページをカスタマイズすることで、特徴のある外観にすることができます。また、メタデータを追加することで、検索機能の改善、ページのレイアウト変更、およびカスタム CSS スタイルの追加を行うこともできます。詳しくは、「フォームポータルコンポーネント用テンプレートのカスタマイズ」を参照してください。

AEM Forms UIでは、カスタムメタデータをフォームに追加することができます。カスタムメタデータは、エンドユーザーに対してフォームの展開・検索機能を提供するのに役に立ちます。カスタムメタデータについて詳しくは、「フォームポータルコンポーネント用テンプレートのカスタマイズ」を参照してください。

フォームポータルは、デフォルトでレンダリングアクションを提供します。フォームポータルをカスタマイズして、他のオプションを追加することもできます。詳しくは、「フォームリスター項目にカスタムアクションボタンを追加する」を参照してください。

関連記事

• フォームポータルコンポーネントの有効化
• フォームポータルページの作成
• API を使用した Web ページ上のフォームの一覧表示
• ドラフトと送信コンポーネントの使用
• ドラフトと送信済みフォームのストレージのカスタマイズ
• ドラフトと送信コンポーネントとデータベースの統合のサンプル
• フォームポータルコンポーネントのテンプレートをカスタマイズする
• ポータル上のフォーム発行の概要

Business.Adobe.com リソース

Customer Communications Personalized Communications Mobile Forms Version History Customer Experience Management Dynamic Forms