フォームを公開してデータの収集を開始

データ収集または送信のためにフォームをお客様と共有する準備が整ったら、公開するだけで、お客様がすぐにフォームを使用できるようになります。

ドキュメントベースのオーサリングエコシステム

前提条件

フォームの公開

1. スプレッドシートを公開
  1. Microsoft SharePoint または Google Drive アカウントを開き、AEM Edge Delivery プロジェクトディレクトリに移動します。

  2. フォームを含むスプレッドシートを開きます。例:enquiry フォームの Microsoft Excel ワークブック

  3. AEM Sidekick を使用してシートをプレビューします。

    AEM Sidekick を使用してシートをプレビュー します。

    プレビュー操作が正常に完了すると、スプレッドシートのコンテンツが JSON 形式に変換されます。プレビューページには、このコンテンツが構造化された表形式で表示されます。例えば、添付の画像は「お問い合わせ」フォームの内容を示しています。

    フォームのプレビューの JSON 形式

  4. AEM Sidekick を使用してシートを公開します。次の節でフォームをレンダリングするために必要となるので、パブリッシュ URL を取得します。URL 形式は次のとおりです。

    code language-json
        https://<branch>--<repository>--<owner>.hlx.live/<form>.json
    
    • <branch> は、GitHub リポジトリのブランチを参照します。
    • <repository> は GitHub リポジトリを示します。
    • <owner> は、GitHub リポジトリをホストする GitHub アカウントのユーザー名を参照します。

    例えば、プロジェクトのリポジトリの名前が「portal」で、アカウント「wkndforms」の下にあり、「main」ブランチを使用している場合、URL は次のようになります。

    https://main--portal--wkndforms.hlx.page/enquiry.json

2. Web ページにフォームを追加

Web ページに <form>.json を追加すると、顧客インタラクションが簡単になり、フォーム入力者が簡単にフォームに入力して送信できるようになります。

Web ページにフォームを追加するには、以下の手順に従います。

  1. Microsoft SharePoint または Google Drive アカウントにアクセスし、[AEM Edge Delivery project directory] に移動します。

  2. フォームを埋め込むドキュメントファイルを開きます。例えば、index.docx ファイルを開くことも、新しいドキュメントを作成することもできます。

  3. ドキュメント内でフォームを挿入するセクションを特定し、これに応じてそのセクションに移動します。

  4. 以下に示す例のように、「フォーム」という名前のブロックをファイルに追加します。

    table 0-row-1 1-row-1
    フォーム
    https://main–wefinance–wkndforms.hlx.live/enquiry.json

    「フォーム」という名前のブロックをファイルに追加

    このブロックは、フォームが埋め込まれるプレースホルダーとして機能します。ブロックの 2 行目に、<form>.json ファイルの URL をハイパーリンクとして追加します。

    note important
    IMPORTANT
    URL がプレーンテキストとして表示されるのではなく、ハイパーリンクとして書式設定されていることを確認します。

    開発またはテスト目的にはプレビュー URL(.page URL)を使用し、実稼動環境にはパブリッシュ URL(.live)を使用します。プレビュー URL およびパブリッシュ URL の例を次に示します。

    プレビュー URL

    table 0-row-1 1-row-1
    フォーム
    https://main–wefinance–wkndforms.hlx.page/enquiry.json

    パブリッシュ URL

    table 0-row-1 1-row-1
    フォーム
    https://main–wefinance–wkndforms.hlx.live/enquiry.json
  5. AEM Sidekick を使用して web ページをプレビューします。これで、ページにフォームが表示されます。例えば、お問い合わせスプレッドシートに基づくフォームは次のとおりです。

    EDS フォームのサンプル

  6. AEM Sidekick を使用してフォームを公開します。これで、お客様はフォームに入力して送信できます。

トラブルシューティング

フォームにデータを送信できません。

次のメッセージのようなエラーが発生した場合は、スプレッドシートが送信されたデータを受け入れるようにまだ設定されていないことを示します。

フォーム送信時のエラー

関連トピック

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab