Word Press

【Word Press定番のお問合わせプラグイン】Contact Form 7の設定方法

【Word Press定番のお問合わせプラグイン】Contact Form 7の設定方法を解説

サイトやブログを運営していく上で必ずと言ってもいいほど必要な機能があります。

 

自営業、フリーランス、アフィリエイトの仕事で集客や営業していくためにカスタマーとの連絡手段としてお問い合わせフォームの設置が必要になってくるのですが、Word Pressにはデフォルト状態ではこの機能がインストールされていないので問い合わせフォーム系のプラグインをインストールしていきましょう。

 

今回は王道のWord PressプラグインContact Form 7での読者やお客様からの連絡手段としてインストール&設定して使えるようにしていきましょう!

 

ちょー簡単です。

 

●まずはWordPressにインストールしてください。

Contact Form 7インストール

●インストール方法

【2020年オススメ!】WordPress初心者に必見プラグインと言う名の最強ツール

 

Word Press にお問い合わせフォームを作る。

お問い合わせフォーム作り方

 

こんな感じです。

 

Contact Form 7のタグを固定ページに貼り付けをしただけで完成してしまいます。

 

導入するのは簡単ですが、もう一つGoogleのreCAPTCHAというセキュリティ機能を使いスパムメールを阻止していかなければいけないので一緒に設定していきましょう!

 

Googleアカウントがあれば大丈夫です。

 

 

Word Pressではセキュリティーの微弱性があったりするので、そこもプラグインなどを利用してカバーしていく必要があるんですよね。。一度設定したら今後はとくに変更がなければいじる必要がないので全ての初期設定を頑張ってください!!

 

とくに問い合わせフォームは海外からのスパムメール被害の可能性もあるので、、、

 

お問い合わせフォーム作り方2

 

 

Contact Form 7をインストールして有効化したら

 

お問い合わせというボタンが出現します。そしてそのままコンタクトフォームをクリック

 

お問い合わせフォーム作り方3

 

コンタクトフォームの編集をクリックします。

 

ショートコードは後で使います。

 

お問い合わせフォーム作り方4

 

基本的にデフォルトで大丈夫です。

 

僕の場合は承諾確認もメッセージ本文と送信の間に設置しています。

 

セキュリティーのためにサイト規約に同意承諾の上メッセージを送信します。にチェックを入れなけらば送信できなくしています。

 

お問い合わせフォーム作り方5

 

メッセージを受信するアドレスを変更したい場合は送信先を変更してください。

 

僕の場合はConohaサーバーを契約した時に使えるメールアドレスに設定していますが、デフォルトだとWord Pressにログインするときのアドレスになっているはずです。

ここは必要に応じてって感じで。

 

変更があれば保存してショートコードをコピーしてください。

 

お問い合わせフォーム作り方6

 

固定ページにお問い合わせページを作成していきます。

 

新規追加をクリックしてください。

 

お問い合わせフォーム作り方7

ショートコードを貼り付けして公開して完了です。

 

このショートコードは記事に貼り付けても利用できるので必要に応じて活用してみてください。

 

Google「reCAPTCHA」でスパム対策

Google「reCAPTCHA」でスパム対策

 

Googleが提供する「reCAPTCHA」を導入して更にWord Pressのセキュリティー性を高めていきましょう。

 

右上の管理コンソールをクリック

 

Google「reCAPTCHA」でスパム対策2

 

●ラベル

お好きな名前に設定

●reCAPTCHAタイプ

reCAPTCHA V3を選択

●ドメイン

https://なしで自分のドメインを入力してください。

●オーナー

ログインしているGoogleアカウントのアドレスが表示されます。

●reCAPTCHA 利用条件に同意する。

チェックを入れる。

●アラートをオーナーに送信する

お好みでチェック。僕は消しています

確認したら送信をクリック

 

Google「reCAPTCHA」でスパム対策3

 

●サイトキー

●シークレットキー

 

この2つを使うのでコピー&ペーストで設定していきます。

 

  1. Contact Form 7にreCAPTCHAを設定する方法
  2. Invisible reCAPTCHAというプラグインを使って設定する方法

この2つの方法があるのですが1の方法で設定して問い合わせでエラーが発生する場合は2の方法で設定してください。

 

Contact Form 7にreCAPTCHAを設定

この2つが表示されるのでContact Form 7に設定していきます。

Google「reCAPTCHA」でスパム対策4

 

お問い合わせフォームのインテグレーションをクリック

インテグレーションセットアップに先ほどのキーを設定していきます。

 

Google「reCAPTCHA」でスパム対策5

 

コピーしたサイトキー、シークレットキーにコピーしたコードを貼り付けて保存してください。

2の方法で設定する場合はココに入力しないでください。

 

Google「reCAPTCHA」でスパム対策6

 

トップページや記事の右下の方にプライバシー利用規約と表示されたら設定完了です!

あとはGoogleが自動でスパムメールから守ってくれます。

 

しかし、この設定でお問い合わせフォーム何度も送信しているのにエラーが発生してしまう場合があります。

 

その場合は対処方法はテーマにコードを追記したり初心者には難しいので2の方法で解決できるはずです。

 

Invisible reCAPTCHAというプラグインを使って設定する方法

Invisible reCAPTCHA for WordPressの設定方法

 

Invisible reCAPTCHAというWordPressプラグインです。

Invisible reCAPTCHAダウンロード

 

このプラグインで設定すると必要な部分にだけreCAPTCHAを表示させる事ができるようになり同時に送信エラーが起きなくなります。

 

↓まずこちらを削除して保存してきてください↓

Contact Form 7 サイトキーとシークレットキーを削除してください

 

僕の場合両方にサイトキーとシークレットキーが設定してあるとお問い合わせフォーム問い合わせエラーが解消させませんでしたので必ず削除してください。

 

Invisible reCAPTCHA設定手順1

 

インストールして有効化したら設定→Invisible reCAPTCHAをクリックしてください。

 

Invisible reCAPTCHA設定手順2

 

●Your site key サイトキー

●Your Secret Key シークレットキー

●Language Japanese

●Badge Position inline

 

それぞれ入力して保存してください。

 

Invisible reCAPTCHA設定手順3

 

WordPressをクリックすると、、、

 

僕はコメントに表示させたいのでこちらにチェックを入れています。

 

お好みでどうぞ!入ってなくても問題なしです。

 

Invisible reCAPTCHA設定手順4

 

Contact Formsに移動してEnable Protection for Contact Form 7にチェック

 

これで保存でプラグインの設定は終了です。

 

Invisible reCAPTCHA設定手順5

 

これで自分のサイトのお問い合わせページを確認してみてください

 

reCAPTCHAのマークでお問い合わせページのみが保護されたので問題解決です。

 

100%入れたから安心ではないので、もしメールフォルダに怪しいメールが届いたら無視したりゴミ箱にぶち込んでください。

 

以上でWord PressプラグインContact Form 7の設定方法は終了です。

 

その他の必要なプラグインはコチラ

【2020年オススメ!】WordPress初心者に必見プラグインと言う名の最強ツール

 

オススメ

-Word Press
-, ,

Copyright© Tayu blog【札幌フリーランス美容師のブログ&SNS集客】 , 2020 All Rights Reserved.