Webフォームを作成する

スパイラルでWebフォームを作る方法をご案内します。

アンケートフォーム
お問い合わせフォーム
キャンペーン応募フォーム

など、様々な用途のフォームが同じ手順で作成できます。

アプリをつくる
DBをつくる
フォームをつくる
フォームの編集
1. 入力必須や文字数制限、エラーメッセージを変更するには
2. フォームのデザインを変更するには
3. サンキューメールを設定するには
フォームの公開
登録データを確認する

１．アプリをつくる

アプリを作成します。

画面の「＋」から作成を開始します。

自分で一からアプリを作成する場合、新規作成を選びます。

アプリ名をつけて保存します。
アイコンは用途に近いものを選びます。

アプリが出来ました。
「引き続き設定を行う」に進みます。

２．DBをつくる

アプリのDBを作成します。

アプリ画面DB「+」から作成を開始します。

DBオブジェクトから、通常DBを選択します。

DB名、タイトル、レコード数を入力して、「構成設定」へ進みます。
レコード数とは、このDBに登録できるデータ数の上限です。ご契約レコード数の範囲で設定してください。

DBには、フォームから送信したデータが登録されます。
フォームから取得したい情報を決めて、DBにフィールドを追加していきます。

例えば、アンケートフォームを作成する場合、以下のような項目構成が考えられます。

フォームに表示したい項目

お名前・・・テキスト30文字前後
メールアドレス・・・aaa@bbb.cc.dd
ご職業・・・会社役員、会社員、自営業、その他
Q1 本日のご来場の目的はなんですか？・・・（択一選択）商談、情報収集、その他
Q2 イベントを何で知りましたか？・・・（複数選択）DM、メール、関係者、その他
Q3 イベントの感想をお聞かせください・・・（自由記述）

表示せずに裏で取得しておきたい項目

登録日時・・・yyyy年mm月dd日hh時mm分ss秒

アンケートフォームのフィールド構成の例

フィールド名	フィールドタイプ
お名前	テキストフィールド(64 bytes)
メールアドレス	メールアドレス（大・小文字を無視）
ご職業	セレクト
Q1 本日のご来場の目的はなんですか？	セレクト
Q2 イベントを何で知りましたか？	マルチセレクト
Q3 イベントの感想をお聞かせください	テキストエリア(512 bytes)
登録日時	登録日時

フィールドタイプとは、データ書式・入力フォームの書式の種類です。
入力させたいデータの形式に合ったタイプを選んで使用します。

フィールドタイプリファレンス (PDF/274KB)

フィールドタイプを選択して、名前をつけます。
画面左側のフィールドタイプ一覧から、ドラッグ＆ドロップで選択ができます。

フィールド名の設定や、入力必須や重複不可の項目もここで設定できます。

選択式項目の選択肢は、歯車アイコンから設定します。

歯車アイコンをクリックすると、設定画面が開きます。
（セレクトフィールドタイプを使用する場合には、ここでHTML表示形式を選択してください。）

画面を下にスクロールして、選択肢を設定します。
ラベルの「＋」ボタンを押すと、選択肢を増やせます。

最後に、「保存」ボタンを押します。

DBが作成できました。

３．フォームをつくる

フォームをつくります。

画面の「＋」から作成を開始します。

フォームを選択します。

フォームの名前、タイトルを入力します。
デバイスの種類、フォームの種類は、それぞれ「マルチデバイス用フォーム」「新規登録」を選んで、最後に「新規作成」を押します。

マルチデバイス用フォームとは、PC、スマートフォン、タブレットなど端末に合わせて表示デザインが自動で切り替わるフォームです。最も汎用的にお使いいただけます。

フォームが作成できました。
「引き続き設定を行う」に進みます。

４．フォームの編集

フォームのURLをクリックすると、作成したフォームが表示されます。

フォームの項目やデザインを変えたい、フォームからの登録に合わせてサンキューメールや通知メールを自動送信したい場合には、左のメニューで編集します。
左にメニューが出ていない場合には、左上の「MENU」を押します。

４．１入力必須や文字数制限、エラーメッセージを変更するには

「フィールド別チェック」を選択します。

プルダウンから、編集したい項目を選択します。

項目タイトルや、入力必須の設定が変更できます。
更にスクロールすると、文字数制限やエラーメッセージの設定ができます。

設定が終わったら「変更」ボタンを押します。

メッセージダイアログが出てくるので、「OK」を押します。
（下の画像はGoogle Chromeの場合です。ブラウザによって表示が異なる場合があります）

変更したい項目の編集がすべて完了したら、最後にトップページへ戻ります。

「変更を反映」ボタンを押してください。

メッセージダイアログが出てくるので、「OK」を押します。
（下の画像はGoogle Chromeの場合です。ブラウザによって表示が異なる場合があります）

変更が完了しました。
正しく変更が完了している場合、「変更を反映」ボタンが押せないようになっています。

４．２フォームのデザインを変更するには

「入力ページ」を選択します。

「入力ページ」では、デザインの設定ができます。
プレビューを見ながら編集すると、変更を確認しながら設定できます。

スクロールすると、他の設定メニューが出てきます。

編集が完了したら、最後に「変更」ボタンを押してください。

以下のようなメッセージダイアログが出てきます。
（下の画像はGoogle Chromeの場合です。ブラウザによって表示が異なる場合があります）

「OK」を押すと、入力ページのデザインをフォームの他のページにも反映することができます。
他のページとは、入力ページで送信ボタンを押した後に表示する「確認ページ」や、確認ページから更に送信した後に表示する「サンキューページ」などです。

ページのデザインを統一したい場合には「OK」を押してください。

連続して、もうひとつメッセージダイアログが出てきます。
こちらは「OK」を押します。
（下の画像はGoogle Chromeの場合です。ブラウザによって表示が異なる場合があります）

デザイン編集が完了したら、最後にトップページへ戻ります。

「変更を反映」ボタンを押してください。

メッセージダイアログが出てくるので、「OK」を押します。
（下の画像はGoogle Chromeの場合です。ブラウザによって表示が異なる場合があります）

変更が完了しました。
正しく変更が完了している場合、「変更を反映」ボタンが押せないようになっています。

４．３サンキューメールを設定するには

フォームから登録されたメールアドレスに対して、自動でお礼のメールを送る設定ができます。

「サンキューメール」を選択します。

サンキューメールを設定するには、「リスト」と「封筒」を作る必要があります。

リストとは・・・サンキューメールを送信するメールアドレスを指定する設定です。
封筒とは・・・メール文面の設定です。

リストの「編集」ボタンを押します。

別ページが開きますので、リストを作成します。

今回はアンケートに回答いただいた方全員に同じ文面のメールを送信する設定をします。
リスト名以外は入力せずに「新規作成」ボタンを押します。

別ページを閉じると、作成したリストがプルダウンに表示されています。

今度は、封筒の「編集」ボタンを押します。

別ページが開きますので、文面を作成します。

まずは「封筒形式」を選択します。
今回は、「テキストメール」という最も一般的な形式を選んで「選択」ボタンを押します。

メール文面を作成するページが開きますが、メールの作成の前に「送信ドメインの登録」を行います。

スパイラルでメールを配信する場合、送信アドレスのドメイン（メールアドレスの@以下）をスパイラルに登録する必要があります。（一度登録すれば、次からは登録不要です）

「送信ドメイン管理」のリンクをクリックします。

メッセージダイアログが出てくるので、「OK」を押します。
（下の画像はGoogle Chromeの場合です。ブラウザによって表示が異なる場合があります）

「新規登録」ボタンを押します。

ドメイン欄に登録するドメイン（@より下の部分）を入力、
「確認用メールアドレス」欄に、ご自身で受け取れるメールアドレスを入力して「確認メールを送信する」ボタンを押します。

確認メール送信完了の画面が出たら、メールが届いているか確認をします。

※メールが届かない場合、もう一度メールを送りたい場合には、送信完了の画面を閉じて、「再確認」ボタンを押します。

送信ドメイン詳細画面から、メールを再送します。
メールが届かない場合には、メールアドレスに間違いがないか、迷惑メールに振り分けられていないかも確認してください。

メールが届いたら、メール内のURLをクリックします。

確認完了画面が出たら、送信ドメインの登録完了です。

ステータスが「使用可」になっています。

アプリメニューに戻ります。

作成したフォームの歯車アイコンをクリックします。

「設定」を選択します。

サンキューメールの設定画面に戻ります。
左にメニューが出ていない場合には、左上の「MENU」を押します。

封筒の「編集」ボタンを押します。

別ページが開きますので、「テキストメール」を選んで「選択」ボタンを押します。

メールを作成します。
画面をスクロールすると、設定画面全体が確認できます。

封筒名（識別名）・・・文面設定の名前です。メールの受信者には表示しません。
サブジェクト（件名）・・・メールの件名です。メールの受信者に表示されます。
差出人・・・メールの差出人名と、差出人メールアドレスを設定します。メールの受信者に表示されます。
（差出人メールアドレスの＠以降は、送信ドメイン登録したドメインから選びます。）