概要

Adobe Experience Manager (AEM) forms のアダプティブフォーム機能を使用すると、デバイスやブラウザーの設定に基づいて PDF や HTML5 に自動的にレンダリングされる、魅力的でレスポンシブなアダプティブフォームを作成できます。アダプティブフォームは、ユーザーの応答に基づいてフィールドやセクションを追加または削除して、ユーザーの応答に動的に対応します。

アダプティブフォームでは、フォームを論理的な複数のセクションに分割でき、こうすることによりエンドユーザーは一度の 1 つのセクションに記入することに集中できます。さらに、AEM forms で提供されているデフォルトのフォームテンプレートを活用したり、既存の Adobe XML または XFA テンプレートを使用したり、あるいは独自のテンプレートを初めから作成したりできます。

注意:

アダプティブフォームのオーサリングは、タッチオーサリングモードではサポートされていません。したがって、URL に /editor.html/ が含まれている場合は、それを /cf#/ で置き換える必要があり、これにより従来のオーサリングモードになります。

アダプティブフォームオーサリング UI

直観的なインターフェイス、ドラッグ&ドロップ機能、標準フォームコンポーネント、およびアセットのための統合リポジトリなどにより、アダプティブフォームを素早く簡単にオーサリングできます。

新しいアダプティブフォームを作成するときまたは既存のものを編集するときは、次の UI エレメントを使用します。

  • コンテンツファインダー
  • アダプティブフォームページ
  • サイドキック
アダプティブフォームオーサリング UI
A. コンテンツファインダー B. アダプティブフォームページ C. サイドキック 

コンテンツファインダー

コンテンツファインダーペインでは、AEM Digital Asset Management (DAM) リポジトリのアセットを検索、表示、および使用できます。これは、画像、ドキュメント、ページ、動画など、さまざまなタイプのコンテンツを分類するいくつかのタブで構成されています。DAM 内のアセットの検索について詳しくは、デジタルアセットの検索と表示を参照してください。

ただし、フォームモデルとして XML スキーマまたは XDP フォームテンプレートを使用しているアダプティブフォームの場合は、フォームモデル階層を示す新しいタブがコンテンツファインダー内に表示されます。フォームモデルのエレメントをアダプティブフォームにドラッグ&ドロップできます。追加されたエレメントは自動的にフォームのコンポーネントに変換され、元のプロパティは保持されます。

アダプティブフォームページ

アダプティブフォームページは実際のフォームです。これは、WCM cq:Page コンポーネントとしてモデル化されたその他すべての WCM ページと似ています。一般的なアダプティブフォームのコンテンツ構造を以下の図に示します。

アダプティブフォーム WCM ページのコンテンツ構造

コンテンツ構造は一般に、次の一次コンポーネントを含みます。

  • guideContainer: アダプティブフォームのルートです。これは、アダプティブフォーム UI 内でアダプティブフォームの開始としてマークされています。このコンポーネントでは、次のことを指定できます。
    • アダプティブフォームのモバイルレイアウト: モバイルデータにおけるフォームの外観を定義します。
    • ありがとうページ: フォームの送信後にユーザーがリダイレクトされるページを定義します。
    • 送信アクション: ユーザーがフォームを送信した後に、サーバーでフォームを処理する方法を定義します。
    • スタイリング: フォームの外観をカスタマイズするために使用する CSS ファイルへのパスを指定します。
  •  rootPanel: アダプティブフォームのルートパネル。これは項目ノードの下にサブパネルを含むことができます。ルートパネルを含む各パネルは、それに関連付けられたレイアウトを持つことができます。パネルのレイアウトは、フォームをレイアウトする方法を指示します。例えば、アコーディオンレイアウトでは、その項目はアコーデオン手順としてレイアウトされます。
  • ツールバー: アダプティブフォームコンテナは関連付けられたグローバルツールバーを持ち、これはフォームに対してグローバルです。このツールバーは、編集バーのツールバーの追加アクションを使用して追加でき、作成者は送信、保存、リセットなどのアクションを追加できます。
  • アセット: このノードは、フォームのオーサリングのために使用する追加情報を含みます。例えば、フォームモデルの詳細、ローカリゼーションの詳細など。

サイドキック

サイドキックは、アダプティブフォームを構築するために使用できるコンポーネントを含みます。コンポーネントをアダプティブフォームにドラッグしてフォームエレメントを追加し、必要に応じて追加しエレメントを設定できます。サイドキック内のアダプティブフォームカテゴリに一覧表示されているコンポーネントの説明を下表に示します。

コンポーネント 機能
ボタン ボタンを追加します。ボタンは、保存、リセット、進む、戻るなどのアクションを実行するように設定できます。
チェックボックス チェックボックスを追加します。
日付選択 日付を選択するためのカレンダーフィールドを追加します。
コンボボックス ドロップダウンリストを追加します(単独または複数選択)。
E署名

ユーザーがフォームに署名できる署名領域を追加します。ここでは、Adobe Document Cloud eSign サービスまたは手書き署名サービスを設定できます。

XDP フォームテンプレートを使用しているアダプティブフォームの場合は、E署名コンポーネントは、アダプティブフォームに関連付けられている元のフォームテンプレートを表示します。

注意: E署名コンポーネントを含むアダプティブフォームは、匿名ユーザーをサポートしません。

添付ファイル ユーザーがサポートドキュメントを参照しフォームに添付するためのボタンを追加します。
画像 画像を挿入できるようにします。
数値ボックス 数値を取得するためのフィールドを追加します。
パネル パネルまたはサブパネルを追加します。
パスワードボックス パスワードを取得するためのフィールドを追加します。
ラジオボタン ラジオボタンを追加します。
リセットボタン フォームのフィールドをリセットするボタンを追加します。
手書き署名 手書き書名を取得するためのフィールドを追加します。
静止テキスト 静止テキストを指定できます。
送信ボタン フォームを設定済みの送信アクションに送信するための送信ボタンを追加します。
サマリ 作成者が指定するサマリテキストを追加します。これはフォームの送信後に表示されます。
利用条件
ユーザーがフォームに記入する前に確認するための利用条件を作成者が指定するために使用できるフィールドを追加します。
テキストボックス ユーザーが必要な情報を指定できるテキストボックスを追加します。
確認

XDP フォームテンプレートを使用しているアダプティブフォームの場合は、確認コンポーネントは、ユーザーが情報を確認するためのフォームをレンダリングします。

注意: 確認コンポーネントを含むアダプティブフォームは、匿名ユーザーをサポートしません。

注意:

子パネルの追加ボタンを使用して親パネルツールバーからパネルコンポーネントを追加することもできます。同様に、ツールバーの追加ボタンを使用してパネル固有のツールバーを追加できます。このツールバーは、パネルの編集ダイアログを使用して、パネルの上または下に表示するように設定できます。

各コンポーネントは、その外観と機能をコントロールするプロパティを関連付けています。コンポーネントのプロパティを設定するには、コンポーネントを右クリックし、編集をクリックしてコンポーネント編集ダイアログを開きます。

コンポーネントは要素名で識別されます。編集をクリックし、要素名フィールドの値を変更することでコンポーネントの名前を変更できます。

注意:

要素名フィールドに使用できるのは、英字、数字、ハイフン(-)、およびアンダースコア(_)のみです。その他の特殊文字は使用できません。また、要素名は英字で始まる必要があります。

サイドキックは、ページプロパティやワークフローなどその他のタブを提供します。一般に、その他のタブを使用しないで、AEM forms のフォーム管理機能のための AEM forms UI を使用することをお勧めします。例えば、発行のためにページプロパティタブを使用する代わりに、AEM forms UI を使用してフォームを発行する必要があります。

フォームのプレビュー

アダプティブフォームをオーサリングしているときに、それをプレビューできます。これは、フォームがエンドユーザーに対してどのように表示されるかを確認し、必要に応じて変更するために役立ちます。フォームをプレビューするには、サイドキックの下部にある をクリックします。 をクリックして編集モードに戻ります。

注意:

デバイスドロップダウンリストから特定のデバイスを選択することで、フォームがさまざまなデバイスでどのようにレンダリングされるかをプレビューできます。このドロップダウンリストは、フォームのプレビュー時にサイドキックの下に表示されます。

さまざまなデバイス上でのアダプティブフォームのプレビュー

本作品は Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License によってライセンス許可を受けています。  Twitter™ および Facebook の投稿には、Creative Commons の規約内容は適用されません。

法律上の注意   |   プライバシーポリシー