お問い合わせのフォームで確認画面があるMW WP Formプラグインを使ってみた

WordPressでWebサイトを構築してお問い合わせページを作ることが多いです。そんな時によく使われるプラグインがContact Form 7です。設定も簡単で導入しやすいプラグインです。

contactform7設置方法

contactform7の設置方法は以前ブログ記事にしました。内容は以下のページから確認ができます。

【プラグイン】Contact Form 7（お問い合わせフォーム）

Contact Form 7の確認画面ページがない

contactform7でお問い合わせを作ったら大体の人が「確認画面はないの？」です。入力にエラーがあると警告は出ますがフォーム内容に問題がないとすぐにフォーム内容が送信されます。

追加プラグインでContact Form 7に確認画面を追加できます。

Contact Form 7 add confirm

プラグインを追加するのは手間がかかりそうだし、ほかに良いプラグインはないのか探してみました。

柔軟なカスタマイズ性ができるプラグインMW WP Form

MW WP Form

このプラグインは日本人開発者が作ったプラグインです。

• 確認画面
• 送信完了画面
• DB保存

などContact Form 7に無い機能があります。

MW WP Form インストール

MW WP Form

公式サイトからダウンロード、またはWordPressの管理画面からプラグイン検索でMW WP Formをダウンロードして有効化してください。

プラグインを有効化したら「MW WP Form」が表示されます。

MW WP Form 設定方法

新規追加をクリックをしてお問い合わせフォームのタグを挿入していきます。

「お名前」のタグを挿入します。「テキストフィールド」を選択してフォームタグ追加するとテキストフィールドの詳細設定のフィールドが開きます。

「name」は必須なので必ず入力してください。classとidはCSS（スタイルシート）で必要な方は入力しておいてください。

• お名前
• 件名
• メールアドレス
• メールアドレス【確認用】
• お問い合わせ内容

簡単なお問い合わせのフォームのタグをコピペできるようにいたしました。

MW WP Form　ショートコード一覧

完了画面メッセージ

フォームタグを設定したら次はフォーム入力完了画面の設定です。画面が遷移するだけなのでメッセージを入力するだけです。htmlタグも使えますので色を付けたり、フォントサイズを大きくしたりできます。

URL設定

何も設定をしなければすべて同一ページでエラー画面、確認画面、送信完了画面が行われます。設定が面倒な方は何も入力しなくてもいいです。

バリデーションルール設定

バリデーションルール設定とは？入力した値が適正か確認することです。上記で作った入力タグを必須にしたり、メールアドレスが不正であるかどうかの確認をするために設定する必要があります。

上記のタグで「お名前」を入力必須にしたいときの設定です。「バリデーションを適用する項目」のところはnameの値を入力してください。あとは必須項目のところをチェックしてください。

メールアドレスも同じように設定をして「必須項目」にチェックを入れて「メールアドレス」にもチェックを入れます。次はメールアドレスの確認です。今回の入力タグにメールドレスを2回入力してもらうようにしてあります。その時のバリデーション設定です。

「バリデーションを適用する項目」はメールアドレス確認用を入れて、必須項目、メールアドレスにチェックを入れて、一致する項目に「メールアドレス」を入力します。この設定でメールアドレスのチェックができます。

自動返信メール設定

入力した人へ自動でメール返信をする設定です。「自動返信メール」の箇所に何も入力をしなければ自動返信メールはできない様になります。

件名：お問い合わせありがとうございます
送信者：株式会社●●
送信元（E-mailアドレス）：自分のメールアドレス
本文：
お問い合わせありがとうございます。

内容を確認の後、担当よりご連絡をさせていただきます。
よろしくお願いいたします。

お名前：{お名前}
件名：{件名}
メールアドレス：{メールアドレス}
お問い合わせ内容：{お問い合わせ内容}

自動返信メール：メールアドレス
※この「メールアドレス」はフォームタグのメールアドレスのnameを値を入力してください。

管理者宛メール設定

お問い合わせがあったら管理者のメールアドレスへメールを送る設定です。

送信先（E-mailアドレス）：自分のメールアドレス
件名：お問い合わせがありました
送信者：{お名前}
※この「お名前」はフォームタグのお名前のnameを値を入力してください。

本文：
お問い合わせがありました。

お名前：{お名前}
件名：{件名}
メールアドレス：{メールアドレス}

お問い合わせ内容：{お問い合わせ内容}

ここまでがMW WP Formの基本設定です。

お問い合わせページを作る

フォームの設定が出来たので固定ページにフォーム識別子を張り付けるだけでフォームができます。

作ったお問い合わせがお問い合わせページです。

まとめ

contact form 7を使っていましたが、MW WP Formのプラグインも設定に慣れれば使いやすいプラグインです。確認画面、DB登録があるのはいいですね。