フォームの追加

フォームを追加するには:

  1. 左サイドバーの要素パネルを開きます。
  2. トップにある「ボックス」タブをクリックします。
  3. 準備されたフォーム1つをドラッグ&ドロップで追加します。

フォームに入力フィールドを追加する

既存のフォームに入力フォームを追加するには、フォームからすでにあるフィールドの1つをコピーして貼り付け、必要に応じてカスタマイズします。

フォームをカスタマイズする

入力フォームの設定を変更するには、編集したいフォームを選択して<input>または<textarea>のタブをクリックします。

以下の設定を変更できます。

  • タグ

HTMLタグを表しています。これを設定することは必須ではありません。HTMLタグについては、こちらをご確認ください。

  • 項目名

入力フォームのタイトル。

  • プレースホルダー

ユーザーが何かを入力フィールドに入力する前に表示されるテキスト。

  • タイプ

入力データには、emailとtextの2種類があります。emailを選択した場合、ユーザーはメールアドレス形式以外の情報を入力することはできません。「phone number」タイプの入力データは、textを使用する必要があります。

  • 必須項目

もし、入力フィールドを必須にしたい場合はチェックをします。

フォームのスタイルをカスタマイズする

ボックスやテキストをカスタマイズするように、フォームのスタイルをカスタマイズできます。

例えば、テキストスタイルとフォント、ボタンの色とスタイル、背景などを変更できます。

ボックスのスタイルの詳細については、こちらをご確認ください。

テキストのスタイルの詳細については、こちらをご確認ください。

高度なカスタマイズ

送信ボタンにホバー効果や入力フィールドにフォーカス効果など、フォームをよりインタラクティブに見せるための効果を追加することができます。

ホバーとフォーカスの設定については、こちらをご確認ください。

フォームの送信

通知メールアドレスを設定する

新しいフォーム送信を受け取ったときに通知を受け取るには、フォームを選択して、ポップアップウィンドウの「通知先の設定・集計結果」をクリックします。プロジェクトのダッシュボードが表示されるので、フィールドに通知を希望するメールアドレスを入力します。

フォーム送信の集計結果を確認する

プロジェクトダッシュボードの「フォーム」タブに移動して、フォーム送信の集計結果を確認することができます。

プロジェクトダッシュボードに移動するには:

  • 編集画面では、トップバーのプロジェクト名をクリックします。
  • STUDIOのダッシュボードでは、プロジェクトをホバーし「Dashboard」を選択します。
Did this answer your question?