ゆうま

「ワードプレスにお問い合わせファームを設置したい!
これを解決できるプラグイン「Contact Form 7」の設定と使い方を解説します。
このプラグインは定番中の定番、多くのユーザーが使用しています。

Contact Form 7の導入方法

Contact Form 7でお問い合わせフォームを作成する、
基礎的な内容について解説します。

 

カスタマイズについては、この項目の後に触れていきますので、
そちらをご覧いただきたい場合は記事中段をご覧ください。

 

WordPress管理画面で、Contact Form 7プラグインをインストール→有効化する

cf71

 

有効化後、管理画面左側のメニュー欄に、
「お問い合わせ」が表示されるのでクリックします。

cf72

 

クリックすると、Contact Form 7設定画面が開きます。
そこにあるデフォルトの「コンタクトフォーム1」をクリック。cf73

 

クリックして開くと、以下のような画面が表示されます(デフォルトの状態)
基本的にはデフォルトのままだと、以下のような表示になり普通に使う分には問題ないです。

 

普通はこれで十分だと思いますが、
カスタマイズしたい場合には設定画面で以下のような項目を設定できます。

 

  1. …何でもOKです(実際のブログには違う名前が設定されるので、自分の管理しやすい名前でOK)
  2. …このままでOK(フォーム以外にもメールなどの各設定ができます)
  3. …このままでOK(これがデフォルトで、上の画面の表示になります。追加、削除したい方は④にて)
  4. …項目を追加したい場合はここから選択して加筆修正してください!

※③の[ ]内にある「*」は、入力必須かどうかを選択するものです。
メッセージ本文は任意なので*がなく[textarea ]になっていますね。

 

以上の設定がお合わったら「保存」を押して完了です。
コードのコピーを忘れずに行いましょう。

 

 

次に、お問い合わせフォームを実際に設置するページを作成します。
管理画面より固定ページの新規作成をクリック。

cf75

タイトルは任意です(これが実際にブログに表示されます)
そこの本文に、先ほど作成したフォームタグを、テキストエディタで入力します。

 

このままだとURL名がお問い合わせと日本語のままなので、
もし英語にしたい場合はスラッグなどで編集しましょう。
(例はmailにした場合です)

cf76

 

これで「お問い合わせページ」の作成が完了しました。
以下のような形で反映されています。

見た目もシンプルできれいです。

 

【おすすめ】Contact Form 7で「スパムを防ぐ」カスタマイズ

お問い合わせフォームを設置していると、
頻繁にスパムのコメントが入るようになってきます。

 

Akismetを設置していればあまり問題ないのですが、
できる事なら、スパムを隔離する以前に、
侵入させたくないですよね。

 

そこで、スパム対策に就航と言われるカスタマイズが
下記のように「チェックボックス」を設置する方法です。
※チェックしないと送信できなくする仕様です。

 

設定画面で「承諾の確認」ボタンを押してフォーム内に下記の文章を追加します(<label>タグと文章を加筆しています)

もし上記の例と同じ文章にしたい場合、以下コピペでご使用ください。

<label> ※送信するにはチェックを入れてください
[acceptance acceptance-734]</label>

 

保存すると、以下のように表示がされます。

以上がスパムを防ぐ効果的なカスタマイズ方法でした。

 

ゆうま

スパム対策は、問い合わせフォーム以外にもコメント欄への対策があります。コメントには「Akismet」で対策できます。簡単に導入できるプラグインなのでぜひ試してみてください。以下の記事で解説しています。

WordPressのセキュリティ!Akismet設定・APIキー取得方法