プラグイン「MW WP Form」を使用したお問い合わせフォームの作成方法

プルダウンをクリックして、挿入したいフォームタグ（質問項目）を選択します。

フォームタグを選択したら、プルダウン右の「フォームタグを追加」をクリックします。

フォームタグによって入力する項目は異なりますが、共通項目は下記の①～⑧です。（下記は「テキスト」タグの例です）
赤い「*」マークのついている項目は入力必須の項目です。

上記①～⑧の入力・設定が完了したら、右下の「Insert」ボタンをクリックしてフォームタグを挿入します。

上記の１～２を繰り返し行い、フォームに必要なタグを追加していきます。
それぞれのタグについては下記の通りです。

フォームタグはたくさんあります。使用頻度の高いものを下記でピックアップしましたので、作成の際にご参照ください。プルダウンで表示されている順番になっています。

フォームの内容が完成したら、確認や送信をするためのボタンを設置します。
ボタンのフォームタグは、「button」と「input」の２項目があります。

「button」と「input」どちらのタグを使用しても構いませんが、これから配置する「戻る」「確認画面へ」「送信する」の３つのボタンは、全て統一したタグを使用しましょう。

ボタン項目（button)

ボタン項目（input)

フォームの内容・送信ボタンタグが設置できたら、フォームの内容は完成です。

画面右上の「公開」内にある「公開」ボタンをクリックして、フォーム内容を保存します。

フォーム編集画面の右列にある「フォーム識別子」に表示されているショートコードをコピーします。「key=”○○”」の数字は、作成したフォームによって異なります。

フォームを設置する固定ページの編集画面を開き、左上にある「＋」ボタンをクリックして、ブロックの挿入ツールを開きます。

ブロックタブのウィジェット欄にある「ショートコード」のウィジェットを選択して挿入します。

挿入したショートコードのウィジェットに、1でコピーしたショートコードを貼り付けます。

5フォームの設置を確認する

「バリデーションルールを追加」ボタンをクリックします。

ルールの枠が１つ表示されます。右端の▼を押して、ルールの入力画面を表示させます。

「バリデーションを適用する項目」に、フォーム作成時に「name」欄へ入力した「項目のキー」を入力します。

挿入したフォームタグからは、「name=”○○”」の箇所で確認できます。

フォーム作成画面

フォームタグの追加時画面

適用するルールの内容を、チェックで選択したり数値等を入力して設定します。複数設定も可能です。
ルールに適さない入力や選択があった場合、確認画面でエラーとして表示されます。正しい入力や選択をしないと送信できないような仕組みになります。

それぞれのルール内容について下記にまとめました。適用する項目と合わせて、適切なルール設定を行ってください。

上記１～２を繰り返し行い、必要なルールを全て設定します。

ルールの設定ができたら、ページ右上にある「更新」ボタンをクリックして、内容を保存します。

実際に設置したフォームで、ルールが適用されているかどうかを確認します。
ルール通りの入力や選択ができていないとエラーが表示されるため、試しに何も入力しないまま確認（または送信）ボタンをクリックしてみてください。エラーが表示されればルールが効いている証明になります。

エラーの場合の例

「①入力画面」のアドレスが「https://○○○/contact/」だった場合、上記②～④の画面は全て同一の「https://○○○/contact/」でリダイレクトされます。
「①入力画面」のフォーム部分が変更されるだけとなり、上下に文章等を入れていた場合には、上記②～④全ての画面で表示されます。

「③完了画面」は、「完了画面メッセージ」の欄に入力したものが反映します。HTMLタグの使用も可能です。ただ、「①入力画面」で入力している文章等を消すことはできません。

画面ごとに表示する文章を変えたい場合は、画面ごとにページを作成しURLを変更する必要があります。
また、Googleアナリティクスでお問い合わせ完了をコンバージョンとして把握したい場合にも便利です。
デフォルトの場合だと作成は簡易的でいいですが、お客様の立場になって見ると同じ文言が続くと少し不安な気持ちになるかもしれません。ページに合わせた適切な文言に変えるためにも、画面ごとにページを作成することをおすすめします！

固定ページで「①入力画面」の他に、「②確認画面」「③完了画面」「④エラー画面」をそれぞれ作成します。
固定ページ内でもわかりやすく管理するために、「①入力画面」を親ページにして、②～④のページは子ページで作ることをおすすめします。

ページのタイトルは、デフォルトの場合は全て「①入力画面」と同様のものが表示されますが、画面ごとにページを作成した場合はそれぞれ決めることができます。適切なページタイトルを入力して設定してくださいね。

１で作成したページの内容を入力し、ページを完成させます。
ページ内でフォームを表示する部分に、フォームのショートコードを設置します。

上記のように、文章→ショートコード（フォーム）の順に設置します。
フォームの下に文章や画像を挿入することも可能です。

各ページに表示する文章のサンプルを掲載していますので、ご参考にしてください。

固定ページにて各ページの作成ができたら、フォームの設定画面へ戻ります。
URL設定の欄に、各画面のURLを入力します。

URLの設定をすると、例えば完了画面のアドレス（/contact/completion/）へアクセスした場合、自動的にフォームの入力画面（/contact/）へ移行されます。（確認画面、エラー画面も同様です）各ページを確認したい場合は、テストとしてフォームを入力して進むか、URLの設定を一度外して確認してください。

入力ができたら、ページを「更新」して内容を保存してください。

実際のお問い合わせフォームを使用してみて、うまく画面遷移ができているかどうかを確認してください。
万が一画面遷移をしない場合には、３でのURL入力に間違いがないか、各ページにショートコードを貼り付けているかを確認してください。

フォーム送信後にお客様へ自動送信されるメールの内容を設定します。

フォーム送信後に管理者へ自動送信されるメールの内容を設定します。

メールの設定ができたら、ページを「更新」して内容を保存してください。

お問い合わせデータが自動的にデータベースへ保存され、WordPressの管理画面上で確認することができるようになります。
個人情報の観点も含めてご検討いただき、保存の可否を決めてください。
保存されたデータは、管理画面レフトナビ「MW WP Form」の「問い合わせデータ」から確認することができます。

初期の状態では表示されていないメニューです。こちらの項目にチェックを入れると表示されるようになります。