【事例紹介】テイクアウトのオーダー受付フォーム

（簡易版の作成についても、当記事後半に記載しております。）

まずは下記リンクのフォームをご覧いただければと思います。

今回のフォームはアンケートではなく、飲食店などでのテイクアウトの注文を事前に受け付ける「オーダー予約フォーム」を想定してみました。

CustomFormの質問項目をうまく活用すれば、ウェブ上で事前のオーダー受付が可能です。

こちらのオーダー受付フォームの要素としては、

となります。

受け付けるメニューやオーダーの内容により、項目の設定の仕方が変わってくると思いますので、一例としてご覧ください。

＜メニュー写真の掲載＞

①まず、フォームページのヘッダーに写真を掲載する場合は、HTMLタグを使用します。

回答画面の説明分や完了コメントページにHTMLタグを挿入することで、画像を掲載することができるようになります。

「基本情報編集」のページの、「基本設定」の中の、

②次に、HTMLタグの有効化を行います。

同じ「基本情報編集」のページで、一番下にある「詳細設定」で設定します。

「詳細設定」の項目にある、「HTMLタグ有効化」にチェックを入れてください。

チェックを入れたら更新をクリックします。

以上で、画像を掲載することができます。

③最後に、ページ上での画像のレイアウトを整えるため、フォームデザインを変更します。

「フォームデザイン選択」のページで、「Linear」を選択してください。

フォームデザインを「Linear」にすることで、適切なサイズ、レイアウトに調整されます。

＜テイクアウトの日時指定＞

日にちの指定は、「質問編集」の「入力タイプ」を「日付選択」を利用します。

また、時間の選択については、「入力タイプ」を「プルダウンメニュー」とし、１５分間隔で入力してみました。

＜メニューの選択と数量＞

メニューの選択については、「入力タイプ」を「ラジオボタン」を使ってみましたが、

「プルダウンメニュー」でもいいですし、複数のメニューを選んでもらう場合には、「チェックボックス」でも良いかと思います。

＜連絡先など＞

お名前、電話番号、メールアドレスについては、「テキストフィールド」を使用しています。

入力サイズや文字制限については、入力してもらう情報形式により適宜選択ください。

＜備考欄＞

備考欄は大量注文や複数多種のオーダーを想定し、「テキストエリア」を選択し、６行のスペースを設けました。

以上で、オーダー事前受付のフォームを作成することができました。

また、もう少し手軽に作成したいという場合には、下記のような簡易版も可能です。

手軽にオーダーを受け付けられるように、入力項目を最低限に絞ったものになります。

実際のフォームは、下記リンクのフォームをご覧いただければと思います。

簡易版のオーダー受付フォームの要素としては、

となります。

受け付けるメニューやオーダーの内容により、項目の設定の仕方が変わってくると思いますので、一例としてご覧ください。

＜メニュー写真の掲載＞

①先ほどはフォームページのヘッダーにメニュー画像を掲載しましたが、今回は「質問項目」の一つとして画像を掲載してみました。

「質問タイトル」を入力しましたら、「補足説明」の欄に、HTMLタグを記入します。

同時に、その下の「入力タイプ」を「見出し（表示のみ）」としてください。

これで、選択肢ではなく、画像のみが見出しとして掲載されるようになります。

②次に、HTMLタグの有効化を行います。

同じ「基本情報編集」のページで、一番下にある「詳細設定」で設定します。

「詳細設定」の項目にある、「HTMLタグ有効化」にチェックを入れてください。

チェックを入れたら更新をクリックします。

以上で、質問項目のエリアに画像のみの見出しとして、メニュー画像を掲載することができます。

他の質問項目については、前半のフォームと同じですので、参考にしていただければと思います。