> ## Documentation Index
> Fetch the complete documentation index at: https://docs.kameleoon.com/llms.txt
> Use this file to discover all available pages before exploring further.

# 成功画面とエラー画面を作成する

> 追加のウィジェット画面を設計し、HTTPレスポンスイベントを構成して、フォーム送信後に成功またはエラーメッセージを表示します。

フォームウィジェットの要素を設計し、ルールを確立し、データ送信を設定したら、追加の画面を作成して、フォーム送信の成功または失敗を訪問者に通知できます。

<Frame>
  ![](https://storage.googleapis.com/kameleoon-storage-documentation/user-manual/images/assets/widgets/create-a-widget-with-the-widget-studio/create-forms/build-success-and-error-screens/video-success-2.gif)
</Frame>

## 画面を設計する

画面を設計するには:

1. Widget Studioの左上にあるウィジェット名をクリックします。
2. **Add screen** をダブルクリックして、検証画面またはエラー画面を作成します。
3. 自由に画面を設計します。

## イベントの設定

画面を作成したら、訪問者のデータ送信が成功するか失敗するかに基づいて、適切な画面を表示するイベントを設定する必要があります。

イベントを設定するには:

1. **Event** > **Add event** をクリックします。
2. **HTTP Response** を選択します。

<Frame>
  ![](https://storage.googleapis.com/kameleoon-storage-documentation/user-manual/images/assets/widgets/create-forms/build-success-and-error-screens/0.png)
</Frame>

<Tip>
  HTTP Responseイベントは、HTTP Requestアクションを追加した場合にのみ表示されます。追加していない場合は、トリガーを設定し、HTTPリクエストアクションを追加してフォームデータを指定したURLに送信することで、ユーザーがフォームを送信した際の動作を定義する必要があります。
</Tip>

3. 表示する画面に応じて **On success** または **On error** を選択します。
4. **Response Name** メニューで、HTTPレスポンスにリンクされたリクエストの名前を選択します。

次に、イベントがトリガーされたときに何が起こるかを指定する必要があります。手順は以下の通りです。

1. **Add action** > **Elements** > **Show element** をクリックします。
2. 表示する画面に応じて、**Success screen** または **Failure screen** を選択します。

<Frame>
  ![](https://storage.googleapis.com/kameleoon-storage-documentation/user-manual/images/assets/widgets/create-forms/build-success-and-error-screens/1.png)
</Frame>

イベントが作成されました。リクエストが成功すると、成功画面が表示されます。エラーが検出されると、エラー画面が表示されます。

<Frame>
  ![](https://storage.googleapis.com/kameleoon-storage-documentation/user-manual/images/assets/widgets/create-a-widget-with-the-widget-studio/create-forms/build-success-and-error-screens/Capture-decran-2023-02-17-a-15.20.32.png)
</Frame>
