ヨコノリライフ

【WordPress】Contact Form 7でお問い合わせフォームを作る

コンタクトフォームアイキャッチ

お問い合わせフォームはSNSとの連携もしているし、必要ないかなと思っていましたが、GoogleAdSenseを申請するためには必須だとよく目にするので実装してみました。

以前GoogleFormを使い実装したことはありますが、メールとしては個人的には使いずらく、かといって個人のメールアカウントに直接メールを送信する方法も分からないため調べていたところ【Contact Form 7】という便利なプラグインを発見!

ただこれが私の場合は一筋縄ではいかずwまぁいつものことですねw

きっと私のように詰まる方もいると思いますので、私が詰まったところを解説していきますね!

もちろんバックアップは取った上で自己責任でお願いします!

Contact Form 7とは

まずここの説明ですね!

自身のサイトのお問い合わせフォームの作成、サイトから送信までできるプラグインです。
しかも個人のメールアカウントに直接送信されるのでスマホからでもお問い合わせの返信ができてすごく便利です。

リンク→【Contact Form 7】管理画面から検索しても出てくるのでどちらでも好きなほうでどうぞ。
ダウンロードしたら固定ページにタイトルだけでいいので「お問い合わせ」などのページを作っておいてください。

設定の仕方

ダウンロードしたら次は設定です。

ダウンロード > 有効化すると「お問い合わせ」がメニューに追加されます。

その中に「コンタクトフォーム1」ができているのでそれを編集。

ここで実際に表示したいお問い合わせフォームを作っていきます。必要な項目を追加、もしくは自分でコードを書いて編集します。

めんどうでも変更するたびに保存してプレビューで確認するといいですよ。保存するとショートコードが出てきます。

プレビューは先ほど作った固定ページに、ショートコードを本文のところに貼り付けるだけでプレビューすると確認できます。

送信先を設定する

ここまでは簡単ですよね!私はこの送信先を設定するのに3時間ほど詰まりました。

ひたすらググりまくりなんとか解決できた方法を解説していきます。かなり長くなりそうなので必要なところまで飛ばしてくださいねw

メールアドレスを作る

はい、ここからなんですw

どのメールアドレスで試しても一向に受信できませんでした。色々な方法があるみたいですが、私はXserverを使用しているのでXserverでメールアカウントを取得しました。

Xserverでの取得方法はこちら

管理者メールアドレスを変更する

Xserverで取得したメールアドレスに変更したくても承認メール待ちから進みません。この時点でそもそもどこにメールが来るんだって思ってましたw

なのでとりあえず管理者メールアドレスだけ変更します。

web検索に(サイトのURL)/wp-admin/options.phpと入力すると「全ての設定」が可能になります。

admin_emailを探して変更したいアドレスを入力し一番下の保存を押して完了です。
この方法だと承認メールは必要ありません。承認中の場合は一度キャンセルしてから行ってくださいね。

送信先アドレスに登録する

Contact Form 7 に戻り「メール」タブを開き「送信元」の項目に変更したアドレスを入力し保存します。

次はスマホの設定

今度は取得したアドレスを受信できるようにします。iPhoneの場合はこちら

ここは手順通りで問題なく進めると思います。私はIMAPで登録しました。IMAPとPOPの違いはこちらのサイトを参考にしました。

送受信テストをしてみる

ここまでで実際にお問い合わせフォームから送信、受信先からの返信を確認し問題なければ完了です。

しかし私の場合はお問い合わせフォームから送信はするものの一向に受信しませんでした。
サーバーがブロック?しているようです。

プラグインを入れる

WP Mail SMTP by WPForms色々調べては見たものの結局プラグインの力を借りることにしました。
極力プラグインを使わずと思ってましたが力及ばず…

設定はウィザードが出てくるのそれに従って進めればオッケー。

送信元は自身のメールアドレス、フォーム名は送信先に表示される名前、メーラーは「その他のSMTP」を選択すればオッケーです。

まとめ

今回のお問い合わせフォームの実装は慣れないこともあり、途中途中でかなり詰まりました。

半日はかかりましたねwですが、優秀な2つのプラグインのおかげでなんとか実装することができました。

プラグインを作る人は天才なんだろな!!

ぜひ、参考にしてくださいね!!

TOPへ戻る
お問い合わせはこちら