設計情報

投稿者: SPIRERS ナレッジ向上チーム 2023年1月20日 (金)

動画で学ぶ SPIRAL ver.2 基本機能 ~【サイト管理】フォームブロック ビジュアル設定 ~

動画

フォームブロック ビジュアル設定説明

動画を見る
※フォームブロック ビジュアル設定について説明している部分(0:13~)へジャンプします。
ビジュアル設定
ビジュアル設定は、「ボタン操作でフィールドの追加やデザイン指定などを行う方法」です。
画面構成はこちらです。
プレビュー 画面ごとのプレビューを確認することが可能
登録フォーム 入力画面や確認画面、完了画面などの各画面の設定やメールアクション、自動登録設定が可能
スタイル シンプルタイプとカスタマイズタイプなど、デザイン指定が可能
JavaScript JavaScript専用の設置場所
共通 全フィールド共通のエラーメッセージや入力必須ラベルなどの設定が可能
登録フォーム
【入力画面】
項目追加は、追加したい場所にカーソルを合わせて +ボタン をクリックし、該当のものを選択します。
項目削除は、削除したい項目にカーソルを合わせて ゴミ箱アイコン をクリックします。
フィールドごとの詳細設定は、フィールド部分をクリックして フィールド設定 から設定します。
【確認画面】
確認画面では入力画面で追加した項目が自動的に反映されますので、再設定は不要です。
テキストの追加や、確認画面での表示設定が行えます。
【完了画面、締切画面、エラー画面】
WYSIWYG(ウィジウィグ)操作で装飾することができます。
完了画面においては、登録した値を表示させることができる レコード値挿入 も可能です。
スタイル
【シンプルタイプ】
テーマ、ラベルエリア、次へ進む・送信ボタンのデザイン変更が行えます。
【カスタマイズタイプ】
ステップフローやフィールドの配置など、より詳細にデザイン変更が可能です。

フォームブロック 注目ポイント

動画を見る
※フォームブロックの注目ポイントについて説明している部分(4:36~)へジャンプします。
フィールド グループ化
ソース編集することなくボタン操作でフィールドをグループとしてまとめて、フォーム上に表示させることができます。
2フィールドだけでなく、複数フィールドのグループ化も可能です。
(例)姓と名フィールドのグループ化
ステップ設定
入力画面を2つに分けるなど、ステップ設定が可能です。
フォームを複数作成し、それぞれをつなげるという作業をする必要はなく、ステップ設定画面から入力ステップを追加するだけです。
確認ステップの追加も可能で、最大で10ステップまで設定することができます。

また、フォームの入力ステップ、確認ステップなど現在のステップ箇所を表示するステップフローの設定も行えます。
【ステップフロー設定 ご注意】
ステップフローはソース設定の場合は設定できません。
ソース設定でステップフローを使用したい場合は、ビジュアル設定で作成後にソース設定に変更することをおすすめします。
reCAPTCHA設定
Googleが提供するreCAPTCHAを簡単にフォームブロックに組み込むことが可能です。
reCAPTCHAは、スパムやbotなどによる不正なアクセスからWebサイトを保護するための仕組みです。

参考リンク

最後に

SPIRAL ver.2のフォームブロックはボタン操作で作成ができるだけでなく、
複数画面のステップ設定やステップフロー、reCAPTCHA設定もノープログラムで実現できます。
セキュリティ高く、利用シーンに合わせたフォームブロックの作成が可能なので是非お試しください。

解決しない場合はこちら コンテンツに関しての
要望はこちら