WordPressで簡単にメールフォームが作れちゃう
おすすめのプラグイン「MW WP Form」の設定方法を紹介します!

つい最近、このブログに新しくお問い合わせページが追加されました!

あなたのブログのファンになってくれたユーザーさんから
「ぜひ管理人さんにメッセージを送りたい!」「この記事を詳しく質問したい!」といったメッセージ。

または、ASPのスタッフさんから「このブログで商品を紹介して欲しい!」
といった依頼のメッセージがが舞い込むことがあるかもしれません。

そんな時のために、ブログには必ず「メールフォーム」を設置しておきましょう!

まずは「WM WP Form」をインストール

WordPressにログインしたら、プラグイン → 新規追加から「MW WP Form」と検索します。

mf01

インストールをしたら、有効化するのを忘れずに…。

「WM WP Form」の基本設定

メールフォームの入力項目に必要なものを考えましょう!

お問い合わせメールに必要なものといえば…、
お名前メールアドレスお問い合わせ内容といったところでしょうか?

ではこの3つの項目を「WM WP Form」でサクッと作ってみましょう!

入力項目を作ろう!

「WM WP Form」を新規作成すると、普段記事を書く時に
使っているWordPressエディタのページが開きます。

mf02

ただ普段のエディタと違うところとはココ!フォームタグを追加という部分があります。

コレを使って「名前を入力するスペース」「メールアドレスを入力するスペース」
そして「お問い合わせ内容を書くスペース」を作っていきましょう!

「お名前」の入力スペースを作る!

mf03

テキストフィールド」を選択しフォームタグを追加します。
すると「テキストフィールド」の設定画面が現れます。

mf04

基本的に設定する部分は「name」「size」「maxlength」の3つですね。

  • name → この項目の名前。(※後で使うので分かりやすい名前をつけましょう)
  • size → 入力項目のサイズ。
  • maxlength → 入力出来る文字数の最大値。

では設定していきましょう。 この「テキストフィールド」は名前を入力してもらう部分なので、
「name」はシンプルに「名前」としました。 これでOKです。次はメールアドレスですね!

mf05

「メールアドレス」の入力スペースを作る!

mf06

先ほどは「テキストフィールド」を選択しましたが、今度は「Emailフィールド」を選択します!
同じように「name」「size」「maxlength」を入力します。

mf07

メールアドレスは長めに設定する人もいるかも知れないので
「maxlength」の数値は大きめに設定しておきましょう。

これで良し!次は実際にお問い合わせ内容を書いてもらう項目ですね。

mf08

「お問い合わせ内容」を入力するスペースを作る!

mf09

こちらも同じく入力項目を作っていきましょう。
テキストエリア」を選択してフォームタグを追加しましょう。

mf10

「cols」は”列”、「rows」は”行”のことです。簡単に言うと入力項目の縦横のことですね!
大分メールフォームっぽくなってきましたよ!これで完成…ではありませんね。

mf11

肝心の「メール送信ボタン」がありません!これではメールを送ることができません。

「メール送信ボタン」を作る!

mf12

メール送信ボタンも簡単に作れますよ!
送信ボタン」を選択して、フォームタグを追加。

mf13

名前を入力すれば、送信ボタンの完成です。ホントに簡単ですね!
これで基本的なメールフォームの完成です!

mf14

実際にメールフォームを使ってみる!

では「MW WP Form」で作ったメールフォームを投稿記事や固定ページで使ってみましょう。

mf15

フォーム識別子というところに[ ]で囲まれたショートコードがありますね?
これをコピーして、表示したいページにそのまま貼り付けましょう!

mf16

mf17

どうですか!?きちんとメールフォームが表示できていますね!
画像では投稿記事に貼り付けていますが、固定ページで作ることをおすすめします。

細かい項目を設定しよう

必須項目の設定

例えばメールアドレスなど「この項目は絶対に入力して欲しい!」という項目がありますよね。
作ったメールフォームに必須項目の設定をしましょう!

「MW WP Form」の下の方に「バリデーションルール」という項目があります。
ここから必須項目の設定が行えます!

「バリデーションルールに適応する項目」にルールを適応したい項目の名前を入力しましょう。
先ほどメールフォームを作った時に「name」を入力しましたよね? あの名前をココに入力します!

mf18

「必須項目」にチェックを入れれば設定は完了です!
メールアドレスを入力する項目なら「メールアドレス」にもチェックを入れておきましょう。

他の「名前入力項目」や「お問い合わせ内容入力項目」も必須にしたい!という場合も
同じようにバリデーションルールに追加して「必須項目」にチェックをしましょう。

完了画面メッセージの設定

完了画面とは、メールフォームの送信ボタンを押した後に表示される画面です。
「メールの送信が完了しました!」的なメッセージを表示する場合は設定しましょう。

mf19

私の作ったメールフォームでは、こんな感じのメッセージが表示されるように設定してます。

自動返信メールの設定

自動返信メールは、実際にメールフォームからメールを送ってくれた
ユーザーに対して自動的にメールを返信してくれる設定です。

mf20

{キー}と本文などに組み込むことで、
実際にメールフォーム項目に入力してもらった文字に変換してくれます。
この「キー」というのは、フォームの設定時の「name」で入力したものです。

つまり{メールアドレス}と入力すると、
ユーザーが入力してくれたメールアドレスに変換されるということです。

うーん、ちょっと分かりにくいですね…。
実際に例を見てみましょう!

私のメールフォームの自動返信メール設定では…。

{名前}さん

この度はお問い合わせいただきましてありがとうございます。
{名前}さんのメッセージ送信が完了いたしました。
お問い合わせ内容は以下の通りです。

お名前:{名前}

メールアドレス:{メールアドレス}

題名・件名:{件名}

メッセージ本文・内容: {内容}

 

折り返し連絡しますので、もうしばらくお待ちくださいませ。

このように本文に入力してあります。
すると実際にメールフォームを使ってくれたユーザーさんにはこのように変換されてメールが送信されます。

うたとさん

この度はお問い合わせいただきましてありがとうございます。
うたとさんのメッセージ送信が完了いたしました。
お問い合わせ内容は以下の通りです。

お名前:うたと

メールアドレス:utato@sample.com

題名・件名:質問です!

メッセージ本文・内容: 結婚していますか?

 

折り返し連絡しますので、もうしばらくお待ちくださいませ。

といったように{キー}の部分が自動変換されてメールが送信されます。

まとめ

メールフォームを作るプラグインだと「Contact Form 7」が有名ですが、
個人的にはこっちの「MW WP Form」の方が設定が簡単だな~と感じたのでコチラを紹介しました!

設置も簡単ですし、自動返信メールの設定も出来ます。
しつこく言いますけど自動変身メール機能って結構大切ですよ!?

私も過去にアフィリエイターさんへの質問メールを送った経験があるのですが…。
メールフォームに確認画面とか、確認メールを送る機能が一切無かったので…、

「メール送信っと!…ん?あれ、今ちゃんと送れた…?」
「送れたよね?メアドとか間違ってなかったよね!?」
「メアド間違って送れてなかったらどうしよう…めっちゃ心配…!!!(; ゚д゚)」

と、意味もなく不安になりました。
幸い、きちんとメールの返事が来たので良かったですがw

ぜひ、「MW WP Form」を使ってみてください!
あ、メールフォームが完成したらご自分で送信テストをしてくださいね。

The following two tabs change content below.
うたと
2014年11月から本格的にアフィリエイトを開始、Lureaで基礎を学ぶ。 初月で○万突破!という感じではなく、地道に少しずつコツコツと稼げるようになったタイプ。現在の月収はほったらかしでも約12,000~16,000ほどのクソザコ。 さらなる飛躍を求めてこのブログを立ち上げます。