未経験でも転職出来る!!Web制作者になった元飲食店員が語るBLOG

  1. WordPress
  2. MW WP Formでお問い合わせフォームを作成!【おすすめプラグイン】

MW WP Formでお問い合わせフォームを作成!【おすすめプラグイン】

どうも、Tommyです。

今回は、『お問い合わせプラグイン』について紹介していこうと思います。

有名どころで言うと『Contact Form 7』『MW WP Form』かなっと思います。

私のおすすめしているのが『MW WP Form』なのでコチラを設定方法等を紹介していきたいと思います。

MW WP Formについて

お問い合わせフォームを作成出来るWordPressのプラグインです。

使い方は非常に簡単なのでとても扱いやすいですし、日本のWebサイトは必ずと言っていいほど『確認ページ』というものが存在します。

それにも対応しているので、お問い合わせプラグインを使うとしたらこちらを重宝しております。
下記におすすめ項目を6個紹介しておきます。

ショートコードで簡単に作成出来る

固定ページに、ショートコードをコピペするだけでフォームが完成します。

しかも、自由にHTMLを入力出来るため多少言語が扱える人は自由にデザインをすることもできます。

URL設定も自由

フォームといえば、『入力ページ・確認ページ・完了ページ』そして、『エラー画面表示ページ』を別で作りたい場合も対応可能。

別のURLで遷移させても、同じURLで遷移させてもどちらでも設定可能です。

バリデーションの豊富さ

バリデーションもワンタッチで設定可能で、項目も多く用意されています。

確認画面を設定出来る

先程も述べましたが、確認画面ページを作成出来ることです。
また、確認画面なしバージョンも設定可能です。

データベースの管理が簡単

お問い合わせのデータというのは、データベースに保存することができます。(しない設定もできます。)

データベースに保存したデータをWordPress管理画面から簡単に確認もでき、CSV形式でダウンロードも出来ます。

グラフ表示も出来る

データベースに保存したデータ(アンケートフォームで収集したものなど)をグラフ表示ができ、傾向分析などにとても便利です。

男の子イラストたから君

簡単に設定できるのは専門知識がない人にとって助かるもんね!

MW WP Formの使い方

ここからは、使い方を紹介していきます。

インストールする

インストール

『ダッシュボード → プラグイン → 新規追加』からインストールしましょう。

フォーム作成する

まず、インストールし有効化にするとダッシュボードに『MW WP Form』と表示されます。
そこから、新規追加をクリックしましょう。

ダッシュボードに追加

ここから、フォームを作っていきましょう。
タイトルには、わかりやすく『お問い合わせ』として問題ないです。

フォーム作成01

上記のように、設定するだけでテキストのフォームが作成できます。
もちろんテキストだけではなく、メールアドレスや電話番号のフォームを簡単に作成できます。

最後には、プルダウンメニューに『確認・送信』というボタンがあるので選択しましょう。

フォーム作成02

とりあえず、フォームは完成です。次にバリデーションを設定しましょう。

バリデーションを設定する

エディター下の方に『バリデーションルールを追加』ボタンがあります。

バリデーション設定01
バリデーション設定02

『バリデーションを適用する項目』に、先程フォームで設定するときに『name=”〇〇”』に設定した同じ値を設定します。

バリデーション設定02

『必須項目』をチェックすると、記入しないとエラーが出るようになります。必要なものには設定しておきましょう。

完了ページを設定する

完了ページ設定01

上記のエリアに記入すると、そのまま反映されます。
完了ページは、ユーザーが送ったデータが無事送信されたことを告げるページです。

  • 無事送信されたこと
  • 返答がない場合の連絡先
  • 送ったあとの対応方法

これらを告げていると、とても親切だと思います。
*この設定は、完了ページも同じURLとして処理されます。

URLを設定する

URL設定01

管理ページ・完了ページ・エラーページとそれぞれ別のURLで設定をする際に、記入します。
後ほど固定ページにショートコードを設定する方法をお伝えします。そのURLをここにコピペしましょう。

特にページを遷移しなくて良い場合は設定不可です。

自動返信メールを設定する

自動返信メール設定01

エディターの右側に設定があります。
先程、上記でフォーム設定をした際に、それぞれ『name=”〇〇”』を設定しましたよね。

ここでは、その『nameの値』を使います。

自動返信メール設定02
上記には、メールアドレスの値を入れます。なので、今回の場合『mail』を記入します。
自動返信メール設定03
上記には、ユーザー宛に自動返信される際の本文を設定します。

昔は、ユーザーが記入したデータを自動返信メールにも表示させていましたが、近年ではセキュリティーを意識して自動返信メールにはデータを載せないことも多くなって来てます。

もし、設定したい場合は『{}』(半角)を使って行きます。

自動返信メール設定04

このように記載すると、ユーザーが記入したデータをそのまま表示してくれます。

管理側メールを設定する

管理側メール設定01

こちらを設定しておくと、お問い合わせが来た際、管理者宛にメールが届きます。設定しておきましょう。

管理側メール設定02

『送信先』は、受信するメールアドレスを設定しましょう。

固定ページにフォームを設置する

上記全て記載できたら、サイトに反映させるために固定ページとリンクさせる必要があります。

フォーム設定01

『フォーム識別子』がショートコードになります。
コピペして固定ページに貼りましょう。
*ショートコードのkey数字は、毎回違います。

下記に固定ページにショートコードを設定する動画を設置しております。

フォーム設定02

もし、『確認ページ・完了ページ』などを別のURLにしたい場合は、それぞれ固定ページを作成し、上記と同じようにショートコードを貼り付けましょう。

その際、それぞれのURLを『MW WP Form』の管理画面にも貼り付けることを忘れないようにしましょう。

まとめ

いかがだったでしょうか。MW WP Formを使えばお問い合わせフォームに必要なものは全て揃っているので簡単にフォームを作成することができます。

もし、それでもわからない場合は遠慮なくお問い合わせください。

わからない箇所を一緒に解決させていただきます。