ver.2サポートサイト

HOME機能サイト管理ブロックフォームブロック

フォームブロック

機能概要

フォームブロック管理では、ページに依存せずにフォームブロックの作成・管理・編集が行えます。

 

※ フォームの作成手順はサイト機能の全体像の操作画面の項目をご参照ください。

※ 作成したフォームブロックはページに設置することで、機能します。

※ ページ作成時/編集時にフォームを作成することも可能です。詳しくはページ機能をご参照ください。

機能仕様

メールアクション

フォーム登録後にサンキューメールや通知メールを送信することができます。

詳しくはメールアクションをご参照ください。
複数ステップ

フォーム入力ページなどを複数ステップに分けることができます。

詳しくは複数ステップ設定をご参照ください。
ステップフロー

フォームの入力ステップ、確認ステップなど、現在のステップ箇所を表示するパーツを設定することができます。

詳しくは、ステップフローをご参照ください。
完了ページ

フォームブロックに完了ページを設定、URLを指定してリダイレクト、内部ページの3種類を設定できます。

詳しくは完了ページ設定をご参照ください。
フォーム締切設定 件数

フォーム登録の登録上限数を設定できます。設定した上限値でフォーム申し込みが締め切られます。
詳しくはフォーム締切設定をご参照ください。
期間

フォーム登録の登録期間（開始、終了）を設定できます。期間はどちらか片方でも設定可能です。

詳しくはフォーム締切設定をご参照ください。

ページとブロックの関係

SPIRAL ver.2ではサイトの中にページを、ページの中にブロックを配置します。

ブロックは複数のページに設置可能です。

その為、同一のフォームを複数ページに配置したい場合は、それぞれにフォームを作成することなく、1つのフォームブロックとして共通管理することができます。

その為、同一ブロックを異なるページに設定している場合、ブロック管理もしくはページ側から当該ブロックを編集、削除した際は、設定している他のページ内の同一ブロックも当該編集や削除が適用されます。

フォームブロック削除時の注意点

・フォームブロック自体の削除は、ブロック管理からのみ行えます。

・ブロック管理からフォームブロックを削除した場合、当該ブロックを設定していたページを閲覧する際、当該ブロックは表示されません。

・ページ編集画面上においては、ビジュアル設定でのフォームブロック、ソース設定上でのフォームタグは残ったままとなります。但し、当該ページの編集時に、そのブロックが残っているとエラーとなります。削除済みブロックを除外して保存してください。

UI：フォームブロック作成/編集

ブロック一覧

サイト一覧　＞テスト環境／本番環境の各ブロックメニューから一覧がご確認頂けます。

表示名をクリックすると各フォームの詳細設定画面が表示されます。

 

ビジュアル設定とフォーム設定で作成/編集方法が異なります。

それぞれ以下のコンテンツをご確認ください。

・フォームブロックのビジュアル設定

・フォームブロックのソース設定

プレビュー

保存前にブラウザー画面での表示をプレビューで確認できます。

左のプルダウンからプレビューするページを選択できます。

プレビューサイズの変更

ブラウザ画面サイズを横幅x縦幅ピクセルで入力できます。

レスポンシブ表示の確認等に使用します。

エラーメッセージの表示確認

各種エラーメッセージの表示確認ができます。

共通タブ

全フィールド共通の、エラーメッセージ、入力必須ラベル等の設定ができます。

デフォルトメッセージは予め作成したデフォルトメッセージを選択できます。

詳しくはデフォルトメッセージ設定をご参照ください。

メールアクション

メールアクション機能を使うと登録者宛の登録完了メールや、運営側への登録通知メールを送信することができます。

 

UI：複数ステップ設定

ステップ設定から入力ステップ、確認ステップを追加することができます。

アンケートフォーム等でアンケート入力と個人情報入力でページを分けたいとき等にご利用いただけます。

1．ステップ設定

フォームブロック編集モーダル左の「ステップ設定」をクリックします。

2．ステップ設定モーダル

現在のステップ設定モーダルが開きます。

左上の＋ボタンからステップを追加できます。また既存のステップの名称も変更可能です。

※追加/変更後の画面

確認ステップは入力ページが複数の場合でも「対象入力ステップ」からひとつのページにまとめることができます。

 

3．複数ステップページの設定

追加したステップページは通常のフォームブロックと同様に編集可能です。

 

 

ステップフロー

フォームブロックのビジュアル設定にて、入力ステップや確認ステップなど、現在のステップ箇所を表示するパーツを追加することができます。

複数の入力ステップを使用するお問い合わせフォーム等、インターネットユーザに対して、現在のステップ箇所を分かりやすく案内するデザインをマウス操作で設定、ご利用いただけます。

 

1．ステップ設定

フォームブロック編集モーダル左の「ステップ設定」をクリックします。

 

ステップ設定モーダルが開きます。

フローパーツをクリックすると、ステップフローパーツの設定画面が表示されます。

 

2.ステップフローモーダル

ステップフロー上に表示するステップ名のラベル名を設定できます。

ラベル名を設定しない場合、ステップ設定のステップ名がそのまま反映されます。

 

ステップフローで使用するデザインタイプを指定します。

 

デザインタイプ設定

タイプ 説明
幅広/幅狭 ステップラベル（アロー） アロースタイルのデザインの種類を選択できます。
ステップラベル（四角） ステップラベルの枠線タイプを選択できます。
ステップ数（四角） ステップラベルの表示/非表示切り替え、枠線タイプを選択できます。
ステップ数（丸） ステップラベルの表示/非表示切り替えを選択できます。
幅狭 ステップ数（円形ゲージ） 円形ゲージの配置を選択できます。

 

3.ステップフローモーダル

ステップフローのデザインはステップ設定から変更できます。

変更できるデザインは、「幅広」または「幅狭」と同じデザインから変更可能です。

 

 

完了

完了時の動作

左メニューの歯車アイコンから完了時の動作を設定できます。HTMLだけではなく別ページへのリダイレクト設定なども可能です。

 

完了画面表示 同フォームブロック内の完了ページを設定します
リダイレクト 別サイトへリダイレクトさせるURLを設定します
サイト内ページ 同サイト内の別ページを指定します

完了画面表示

同フォームブロック内にある完了ページを表示します。

レコード値挿入

フォームで入力した値を完了画面に表示させる機能です。

「レコード値挿入」ボタンをクリックすると同フォームで使用しているDBの各フィールドが表示されます。

※2021年6月(ver.2.17)時点では、日時型フィールドおよびファイル型フィールドは使用することができません。

 

ソース設定の例：選択したフィールドが完了画面のHTMLソースにThymeleafタグで挿入されます。

 

ビジュアル設定の例：選択したフィールドが{{@DB識別名.フィールド識別名}}の形で挿入されます。

 

実際の完了画面での表示例です。入力した名前が完了画面で表示されています。

リダイレクト

外部ページに完了画面をリダイレクトします。

サイト内ページ

サイト内のページを指定できます。

ページIDで紐づけられているので、ページ側で親ページやページ識別名が変更された場合でも設定は関連付けされます。

エラー

入力/確認ステップページと同様に完了/エラーページの作成ができます。(↓ビジュアル設定の場合の表示)

締切

フォーム登録に締切設定を行うことができる機能です。件数と期間で設定することができます。

締切ページの設定

登録期間以外の締切状態のコンテンツを設定できます。

フォーム設定タブ（ビジュアル設定の場合）またはHTMLタブ（ソース設定の場合）の左メニュー「締切」から設定します。

締切設定

左メニュー「締切」の歯車メニューから締切の詳細を設定できます。

件数で締切

指定した登録件数以上になった際にフォームにアクセスすると締切ページが表示されます。

登録件数はテスト環境と本番環境でそれぞれカウントされます。

※同じタイミングに複数の登録が発生する場合などは、締切件数を超えて登録される場合があります。

期間で締切

指定した期間（開始日、終了日）にフォームにアクセスすると締切ページが表示されます。

１）登録期間

　　フォーム登録を受け付ける期間を指定します。開始のみ、終了のみの設定も可能です。

２）登録期間のタイムゾーン

　　指定した登録期間のタイムゾーンを指定することで、海外用フォームなどを準備する際に現地時刻での締切設定が可能です。

その他