現在表示中:

概要

Adobe Experience Manager Mobile は、コンテンツに富んだユーティリティベースのクロスプラットフォームモバイルアプリケーションです。AEM Mobile について詳しくは、「AEM でモバイルアプリケーションを開発する」を参照してください。

AEM Mobile を使用してモバイルアプリを作成すると、レスポンシブで魅力的なアダプティブフォームやドキュメントの埋め込みが可能になります。アダプティブフォームを埋め込むことで、カスタマイズされたデータ収集エクスペリエンスを作成できます。例えば、オンラインの小売サイトのアプリを作成するとします。アダプティブフォームを使用して、顧客に名前、住所、社会保障番号、クレジットカード番号など個人情報の提供を求めます。AEM Mobile でアプリを作成すると、アプリにアダプティブフォームを埋め込むことができます。アダプティブフォームに加えて、アダプティブドキュメントもアプリに追加できます。 

注意:

現時点では、アプリがオンラインの時のみ、ユーザーによるフォームの表示や記入が可能となっています。 

AEM Form コンポーネントを使用して AEM Mobile にアダプティブフォームやドキュメントを埋め込む

設定

AEM Form コンポーネントは正しく機能するためにクライアント側の JavaScript に依存します。コンポーネントの初期化およびランタイムのロジックは、clientlib: aemfd.mobile.angular.core によって処理されます。コンポーネントが正しく機能するよう、オフラインでもクライアントライブラリがアプリで確実に使用できるようにしてください。

クライアントのライブラリをオフラインで確実に使用できるようにするには、コンテンツの同期の設定を適切に変更してください。コンテンツの同期の設定を適切に変更するための推奨事項については、「アプリを構成する」の JavaScript と CSS の clientlib の節を参照してください。

注意:

すぐに使用できる Geometrixx Outdoors アプリケーションの場合は、対応するエントリを、/etc/designs/phonegap/geometrixx/ng-outdoors/ng-clientlibsall にある clientlib の埋め込みプロパティの aemfd.mobile.angular.core に追加します。

AEM Forms コンポーネントを使用する

AEM Form コンポーネントを使用して、アプリにアダプティブフォームやドキュメントを埋め込みます。AEM Forms コンポーネントによって、アプリがオフラインの場合や、顧客がフォームを送信した場合に、オフラインメッセージや「ありがとうございます」メッセージが表示されます。

AEM Mobile でアダプティブフォームやドキュメントを埋め込むコンポーネントを使用するには、次のステップを実行します。

  1. アプリページを編集モードで開きます。

    アプリページを編集モードで開いたら、サイドパネルが表示されていることを確認します。ページのツールバーのサイドパネルを切り替え を使用して、サイドパネルを表示または非表示にします。

  2. コンポーネントブラウザーパネルから、AEM Form コンポーネントをそのページ上にドラッグアンドドロップします。 

  3. AEM Form をタップしてから、アクションバーの  をタップします。AEM Form ダイアログが開きます。

    選択したアセットのタイプに基づいて、選択肢は異なります。 

  4. AEM Form ダイアログで、次の設定を行います。

    アダプティブフォームアセットタイプ

    アセットパス

    埋め込むアダプティブフォームを閲覧して選択します。

    「ありがとうございます」メッセージ

    フォーム送信時に表示するメッセージをリッチテキストエディターで書き込みます。

    テーマ

    (オプション)アダプティブフォームのコンポーネントのスタイル設定を定義するテーマを閲覧して選択します。スタイル設定には、フォントスタイル、背景色、サイズ、配置など、外観のプロパティが含まれます。

    AEM Forms のテーマ」を参照してください。

    ページ言語を使用

    このオプションを有効にすると、AEM Form はこのページアプリの言語を使用します。 

    高さ

    (オプション)コンテナの高さをピクセル単位で指定します。デバイスのディスプレイのサイズに合わせてコンテナの高さを自動で調整するには、空白のままにします。 

    CSS クライアントライブラリ

    (オプション)アダプティブフォームのテーマが関連付けされていない場合、そのフォームがフォールバックする CSS クライアントライブラリを指定することができます。 

    オフラインメッセージ

    ユーザーがフォームを開こうとした時アプリがオフラインの場合に表示するメッセージを指定します。

    アダプティブドキュメントアセットタイプ

    アセットパス

    ページに埋め込むアダプティブドキュメントを閲覧して選択します。

    高さ

    (オプション)コンテナの高さをピクセル単位で指定します。デバイスのディスプレイのサイズに合わせてコンテナの高さを自動で調整するには、空白のままにします。 

    CSS クライアントライブラリ

    (オプション)アダプティブフォームのテーマが関連付けされていない場合、そのフォームがフォールバックする CSS クライアントライブラリを指定することができます。 

    オフラインメッセージ

    ユーザーがドキュメントを開こうとした時アプリがオフラインの場合に表示するメッセージを指定します。

  5.   をタップして設定を保存します。これで、アダプティブフォームまたはドキュメントがページに埋め込まれました。

アセットブラウザを使用して AEM Mobile にアダプティブフォームやドキュメントを埋め込む

顧客がアプリで表示するフォームやドキュメントをアセットとしてドラッグアンドドロップすることができます。アセットブラウザーを使用して、AEM Mobile にアダプティブフォームを追加するには、次のステップを実行します。 

  1. アプリページを編集モードで開きます。

  2. サイドバーのアセットの下のドロップダウンリストから、アダプティブフォームを選択します。

    アセットのドロップダウンリストからアダプティブフォームを選択
    アセットのドロップダウンリストからアダプティブフォームを選択

    アセットブラウザは、AEM Forms サーバーで使用できるすべてのアダプティブフォームをフィルターおよびリストアップします。

  3. フォームをアプリのページ上にドラッグアンドドロップして、アプリにフォームを埋め込みます。

    フォームは使用可能なスペースに合わせて自動で調整されます。フォームを編集する場合、フォームはエディタで別に開きます。

    ページに追加できるフォームは現在、1 つのみになります。

    注意:

    アダプティブドキュメントを AEM Mobile に追加するには、前のステップでアダプティブフォームの代わりにアダプティブドキュメントを選択します。

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

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