OWLetのすごいところ vol.3 簡単フォーム構築
OWLetではプログラムの知識は一切不要でブラウザ上で簡単にフォームを構築することができます。
実際の構築フローを解説します。
実際の構築フローを解説します。
まずはレイアウトを作成します。
下層ページ用と同階層にフォーム用のレイアウトを作成しましょう。
フォームレイアウトの中身は下記パーツ構成で構築しています。
（筆者の構築例です。フォームレイアウトに必須の項目はシステムコンテンツになります）
・セクション：フォームページのセクション枠
・ページ名見出し：ページ名見出しを選択することで自動的にフォーム名を取得します。
・継承エリア：見出し下にテキストを配置する為の継承エリア
・枠：class「inquiry_form」を設定します。
・システムコンテンツ：システムコンテンツを設置した箇所にフォームが出力されます。必ず必要です。
以上でレイアウトの設定は完了しました。
step2 管理画面の設定
管理画面でフォームの設定を行っていきます。
「setting」→「フォーム」から設定します。
フォームを作成する為に項目を設定していきます。
フォーム種別：一般的なお問合せ、資料請求、注文受付、求人関連、予約申込み
※種別による機能の差はありません。管理画面TOPでのアイコンが変わります。
レイアウト：作成したフォーム用を選択
ページURL：inquiry
ページ名：入力・確認・完了があります。レイアウトにページ名見出しを設置したことにより、ここに設置したものがh2として出力されます。
ページデザイン：オリジナルレイアウトのフォームを作成できます。今回は割愛
必須マーク：必須項目のマークを設定します。
入力項目設定
フォームの入力項目を設定していきます。
一覧表示：お問合せ一覧に項目を表示するか設定します。
必須入力：必須項目の有無を設定します。
コード：英語で項目のコードを指定します。わかりやすいものを指定しましょう。
（例）名前：name
コードは自動返信メールの変数に使用されます。
入力例等：項目の下にテキストを表示します。
入力タイプ：項目に対応したものを選択します。
基本的にアーティクルの項目設定と違いはありません。
ここで気をつける点は入力タイプにメールアドレスを選択時、
「通知用メールアドレス」にチェックを入れましょう。
自動返信設定
入力項目の設定後は自動返信設定を行いましょう。
自動返信設定ではお問い合わせ者と管理者への設定が行なえます。
自動返信：有効にチェックを入れます。
送信元メールアドレス：メール送信元アドレスを設定します。基本的にサイトドメインアドレスになります。
件名：メール件名を入力します。
本文（テキスト）：メール本文を入力します。
本文（HTML）：HTMLメールの設定が行なえます。
メール設定の右には変数が表示されます。
入力項目で設定したものが全て表示されます。
件名、本文にコピペすることで自動返信メールに項目に入力された値が変数に出力されます。
これで管理画面側の設定は一通り完了です。
step3 入力・確認・完了画面を設定する
ページ管理を表示します。
管理画面で設定したページが生成されているのが確認できます。
ページを確認してみましょう。
事前にレイアウト設定をしたので表層はほぼ完成しています。
見出しには管理画面で設定したページ名が表示され、
class「inquiry_form」の中のテーブルに事前にスタイルを設定しておくことで、フォームの見た目も入っています。
残り必要なものは「入力」「確認」「完了」ページのテキスト文になります。
ページ管理からそれぞれのページに遷移しテキストを配置して完了となります。
以上でフォームの構築は完了です。
ものすごく簡単ではないでしょうか？
この流れを覚えてしまえばフォーム1基構築するのに15分もかからないでしょう。
プログラマいらずのOWLetならではの簡単構築が可能となっています。
