プラグイン

Contact Form 7の使い方と設定|カスタマイズしてチェックボックスを設置しよう

ワードプレスのプラグインContact Form 7は、お問い合わせフォームを作成するプラグインです。

トレンドブログを始めようと思った人の中には

問い合わせフォームなんていらなくね?(´゚д゚`)

って思っている人もいると思うんですよ。

僕も初めてサイトを運営した時にそうだったんで・・・

ただトレンドブログに限らず、ブログやサイトを運営する上でお問合せフォームの設置は必須です。

それではContact Form 7の設定と使い方、カスタマイズ方法について解説します。

Contact Form 7の設定

Contact Form 7の設定方法を解説します。

Contact Form 7をインストール&有効化

Contact Form 7

ダッシュボード左側のメニューから、[プラグイン]>[新規追加]をクリックします。


 

Contact Form 7

Contact Form 7を検索し、[今すぐインストール]をクリックします。

Contact Form 7

[有効化]をクリックします。


 

Contact Form 7 設定ワードプレスの管理画面の左側のメニューの【お問い合わせ】をクリックします。


 

Contact Form 7 設定

デフォルトの状態だと【コンタクトフォーム1】がありますので、【コンタクトフォーム1】をクリックします。


 

以下がデフォルトの設定画面の状態です。

Contact Form 7 設定

名前はデフォルトは「コンタクトフォーム1」となっていますが、将来的にフォームを増やしていった時に分かりづらくなるので、お問い合わせなど、分かりやすい名前に書き換えておきましょう。

  • お名前(必須)
  • メールアドレス(必須)
  • 題名
  • メッセージ本文
  • 送信

デフォルトのお問合せフォームの項目は、上記の項目が設定されています。

URLや電話番号など、必要に応じて上部の設定ボタンで設定することが出来ます。

初期設定の状態で最低限の設定にはなっていますので、変える必要が無ければそのままでも使用できます。

このままで良ければ【保存】をクリックして完了です。

Contact Form 7の使い方

Contact Form 7を設定が完了しても、訪問者にお問い合わせフォームを見せるようにしなくてはなりません。

Contact Form 7 使い方

Contact Form 7の管理画面で、上の画像の赤枠のショートコードをコピーします。


 

Contact Form 7 使い方

ワードプレスの管理画面左側のメニューの[固定ページ]>[新規追加]をクリックします。


 

Contact Form 7 使い方

タイトル名と記事本文にコピーしたショートコードを貼り付け、「公開」をクリックします。

タイトル名はなんでも良いですが、実際にブログに表示されるので訪問者に分かるような名前を付けましょう。

これでお問い合わせフォームは完了です。一度確認してください。

Contact Form 7 使い方

正常に完了していれば上の画像のようなお問い合わせフォームが設置されます。

お問合せフォームは固定ページに設置しだので、グローバルメニューやサイドバーなどに固定ページをリンクさせておきましょう。

Contact Form 7のカスタマイズ方法

Contact Form 7

前述したとおり、Contact Form 7はデフォルトで最低限の設定はされているので、すぐに使用できます。

しかし、デフォルトの設定ですと、訪問者がお問い合わせフォームに記入し「送信」ボタンをクリックした時の反応がありません。

これは送信ボタンをクリックした時に無事に送信できるとメッセージがでるのですが、一番下に申し訳程度にでるので見落とすことがよくあるんですね。

また表示されなかったりすることもあります。理由は・・・テンプレートとの相性なのか・・・ん~なんとも分かりません。

だから送信できてないと思って、何度も送信してしまう事が起こり得るんですねぇ。

Contact Form 7はとても便利なプラグインですけど、ちょっと不親切・・・

ただ、お問い合わせフォームを送信する前の確認表示や送信した後の結果表示は、日本だけの常識のようで、何も反応がないのは海外では当たり前のようなのです。

そして、アクセスが増えるに連れてスパムメールが増えていきます。

これが結構煩わしいので、Contact Form 7の設定を少しカスタマイズして訪問者の安心感や誤送信防止、スパムメール対策しておきましょう。

というわけで、まとめるとカスタマイズする理由は

  • ユーザビリティの向上
  • スパムメール対策

となります。それでは解説します。

お問い合わせフォームにチェックボックを設置しよう

まずユーザビリティの向上として、訪問者に確認を促すためにチェックボックスを設置します。

Contact Form 7 カスタマイズ 方法

チェックボックスは送信ボタンの上に設置するので、【メッセージ本文】と【送信】の間にチャックボックスのショートコードを記入します。

「承認確認」をクリックします。


 

Contact Form 7 カスタマイズ 方法
  • 名前:お好きな名前を
  • オプション:2つともチェックなし

基本はデフォルトで問題ありません。

オプションのチェックも必要ありません。オプションにチェックすると挙動が全て逆になってしまうので。

上のオプションは、お問い合わせフォームを開いた時点でチェックボックスにチェックが入っています。

下のオプションは、チェックをハズしたら承認済みっていうことになります。

確認したら「タグを挿入」をクリックします。


 

Contact Form 7 カスタマイズ 方法

承諾確認のショートコードが挿入されるのですが、これだけだとチェックボックスだけが表示されるので、ショートコートの次に確認を促すメッセージを記入しましょう。

上の画像の場合、「上記の内容でよろしければチェックを入れて送信してください。」というメッセージを添えています。

最後に「保存」をクリックします。

以上でお問合せフォームにチェックボックスの設置は完了です。


 

Contact Form 7 カスタマイズ 方法

最後にお問合せフォームを確認してみましょう。

ユーザーに確認を促すチェックボックスが設置できました。

Contact Form 7とAkismetを連携させる

お問い合わせフォームにチェックボックスを設置することで、ユーザビリティだけでなくスパムメール対策にもなりますが、さらにAkismetを連携させることで、スパムメールをブロックしてくれます。

Akismetプラグインをまだ導入していない人は、先にAkismetを導入しておきましょう。

Contact Form 7 カスタマイズ 方法

Akismetと連携できるのは「メールアドレス」タグ、「テキスト」タグ、「URL」タグです。

今回は「お名前(必須)」と「メールアドレス(必須)」をAkismetと連携させてみます。

まずお名前の[text* your-name]を消して、上部設定ボタンの「テキスト」をクリックします。


 

Contact Form 7 カスタマイズ 方法
  • 項目タイプ:必須項目にする場合はチェックを入れる
  • 名前:your-name
  • Akismet:チェックを入れる

名前はyour-nameに変えます。Akismetにチェックを入れます。

この項目を必須にしたのであれば、一番上の項目タイプにチェックを入れてください。

ショートコードは以下のように変わります。

[text* your-name] ⇛ [text* your-name akismet:author]

「タグを挿入」をクリックします。


 

Contact Form 7 カスタマイズ 方法

メールアドレスの方は設定ボタンの「メールアドレス」をクリックします。

設定は前述した「テキスト」の設定と同じです。

名前をyour-emailに変えます。Akismetにチェックを入れます。

この項目を必須にしたいのであれば、一番上の項目タイプにチェックを入れてください。

ショートコードが以下のように変わります。

[email* your-email] ⇛ [email* your-email akismet:author_email] 

「タグを挿入」をクリックします。


 

Contact Form 7 カスタマイズ 方法

ソースコードが上の画像のように変わったことを確認して、保存しましょう。

これで、お名前(必須)欄とメールアドレス欄がAkismetと関連付きました。


 

次に動作確認してみましょう。名前を「viagra-test-123」にして動作確認します。

「viagra-test-123」はAkismetにスパムとして認識されるテスト用の送信名です。

Contact Form 7 カスタマイズ 方法

送信ボタンを押すと、下に上記のようなメッセージが出ました。これで動作が確認できました。

ちなみに下のメッセージも設定できます。

Contact Form 7 カスタマイズ 方法

メッセージタブをクリックするとメッセージの一覧がありますので、好みでメッセージを書き換えてみても良いでしょう。

お問合せフォームを作る意味

お問い合わせフォームは、ブログに来たユーザーが運営者にメッセージを送るフォームです。

お問合せフォームの必要性は

  1. クレーム対応
  2. 企業からの依頼

この2点です。

クレーム対応

アクセスが集まってくると稀に記事に対してクレームが入ることがあります。

ただ文句を言いたいだけのクレームもあるのですが、そんなのは無視でかまいません。

しかし、記事の対象者からクレームが入ることがあるんです。

もちろん正しい情報のもとで記事を作成していかないといけないですが、それでも記事の内容が真実とは違う事が発生する可能性はあります。

また真実だったとしてもイメージ的によろしくなかったらクレームが入ることも。

そのようなクレームに対応するためにお問合せフォームは必要となります。

もしお問合せフォームが無かったら、直接サーバー会社にクレームが入ったり、最悪裁判沙汰や賠償問題に発展しかねません。

最悪の展開を防ぐためにも、リスク回避の意味でお問合せフォームは必要となります。

もちろん、過度なゴシップネタやフェイク記事などアクセス集めを目的だけの記事にならなければ、クレームはほとんどありません。

記事の内容はできるだけポジティブな内容が望ましいです。

マイナスな記事(ネガティブだったり極度のゴシップ)は、書かれた本人や関わっている人にとって心象はよくありませんよね。

企業からの依頼

アクセスが増えてきたり、記事が上位表示されていくと、企業から広告掲載やASPの依頼が来ます。

ASPはオープンなとこから、紹介や企業からのオファーが無い限り利用できないクローズドのASPまで。

これらは収益を上げる要因ともなるので、いいと思ったら積極的に活用すべきですね。

そんな企業からの依頼もお問合せフォームから来るので、機会損失させないためにもお問合せフォームは設置しましょう!