ライフ

WordPressにContact Form7を使って問い合わせフォームを簡単に設置する方法【初心者向け】

2018年5月12日

WordPressプラグインContact Form 7

WordPressにContact Form7プラグインを使って問い合わせフォームを作る方法を紹介します。

Contact Form7で問い合わせフォームを作成する

Contact Form7で問い合わせフォームを作成していきますが、やり方は簡単です。

この記事のとおりに進めていけば数分で作成できます。

Contact Form7プラグインを追加する

プラグインの追加メニューでキーワードに「contact form」と入力します。すると富士山アイコンの「Contact Form7」プラグインが表示されますので「今すぐインストール」をクリックします。

cpntact form7プラグイン追加

Contact Form7プラグインを有効化する

インストールが完了した後、「有効化」ボタンをクリックします。

contact form7プラグインの有効化

有効化が成功すると下のように「お問い合わせ」というメニューが新しく追加されます。

contact form7有効化成功

これでContact Form7で問い合わせフォームを作成する準備が出来ました。

問い合わせフォームを新規追加する

「お問い合わせ」メニューの新規追加をクリックします。

問い合わせフォームを新規追加する

すると下のような問い合わせフォームの新規追加画面が表示されます。

contact form7新規追加画面

初期状態では5つの項目が設定されています。

  1. 名前(必須項目)
  2. メールアドレス(必須項目)
  3. 題名(メールタイトル)
  4. メッセージ本文(メール本文)
  5. 送信ボタン

次に「コンタクトフォームを追加」の下の入力ボックスに任意のフォーム名を入力します。何でもいいですが、ここではお問い合わせと入力します。

入力した後に「保存」ボタンをクリックします。

contact form7の問い合わせフォームを保存

保存が完了すると下のようにコンタクトフォームのショートコードが生成されます。ショートーコードを選択してコピーしておきます。

contact form7ショートコード生成

固定ページに問い合わせフォームを設定する

作成した問い合わせフォームを固定ページに設定します。

「固定ページ」メニューの「新規追加」をクリックします。

contact form7を固定ページに追加する

すると下のような固定ページ新規作成ページに移動します。

新規固定ページを追加の下に固定ページのタイトルを入力します。

本文の箇所に先ほどコピーしておいたコンタクトフォームのショートコードを貼り付けます。

あとは、プレビューで表示を確認し「公開」ボタンをクリックして問い合わせページ公開は完了です。

固定ページ新規追加

下のような問い合わせページが作成されます。

contact form7初期設定を表示した画面

問い合わせフォームのメール・メッセージ・その他設定

Contact Form7で作成した問い合わせフォームは、メールの受信先やメッセージ送信時のメッセージ変更も簡単にできます。

以下はメッセージの変更画面です。初期メッセージが設定されているので触らなくてもよいですが、こだわりたい方は任意のメッセージに変更しましょう。

contactform7のメッセージ変更画面

Contact Form7のスパムメール対策方法

Contact Form7は初期状態から必要な項目が設定されているのでそのまま使えますが、もしスパムメールが来るようであればスパムメール対策の設定も追加してみてください。

承諾確認(チェックボックス)を追加する

一般的な問い合わせページでよく見る内容確認・承諾確認のチェックボックスを追加します。

まず、「お問い合わせ」メニューの「承諾確認」をクリックします。

contactform7の承諾確認をクリックする

クリックすると以下のような承諾確認の設定ページが表示されます。同意条件に任意の内容を入力して「タグを挿入」をクリックします。

ここでは「上記の内容で送信します。よろしければチェックを入れて送信してください」と入力しました。(その他の項目は初期値、空でOKです)

contactform7の承諾確認の設定ページ

タグを挿入すると、下のようにフォーム画面に承諾確認のタグが挿入されますので保存して完了です。

contactform7の承諾確認のタグ

完成すると下のように表示されます。

contactform7承諾確認の表示

クイズを追加する

問い合わせフォームに簡単なクイズを追加します。クイズの回答が不正解だと送信エラーになるよう設定できます。

「お問い合わせ」メニューの「クイズ」をクリックします。

contactform7のクイズ追加ボタン

すると下のようなクイズ設定画面が表示されます。「クイズと回答」に任意のクイズを入力し「タグを挿入」ボタンをクリックします。(その他の項目は初期値でOKです)

contactform7のクイズの問題設定

クイズと回答の間に”|(パイプ)”を入力します。”|(パイプ)”の前に入力した内容が問い合わせフォームにクイズとして表示され、”|(パイプ)”の後に入力した内容がクイズの回答となります。

クイズを複数設定する場合は、2行目・3行目にクイズを入力していきます。複数設定したクイズは、ランダムで表示されます。

1+1=をクイズとし2を回答とする場合は、クイズと回答欄に1+1=|2と入力します。

完成すると下のように表示されます。

contactform7クイズ表示

google reCAPTCHAを使ってスパム対策

google ReCAPTCHAは、googleがウェブサイトにアクセスする人間かロボットかを判別するための仕組みです。

道路標識のや車の写真を選ぶ認証画面が出てくることがあると思いますがあれです。

googleのシステムでウェブサイトへのアクセスロボットであると判定された場合に、認証画面が出てきます。

スパム対策に非常に有効ですので必須レベルで使ってください。

設置のやり方は以下の記事でわかりやすくまとめられていましたので参考にしてみてください。

まとめ:Contact Form7はワードプレス使い必須のプラグイン

WordPressならContact Form7プラグインを使うと、初心者でも簡単に問い合わせフォームを設置できました。

また、Contact Form7を設置するだけでなく、一緒にスパム対策もおこなっておいてください。

スパム対策だけあとからやろうと思っていたらどんどん後回しになるかもしれませんので、スパム対策はContactForm7の設置とセットでおこなっていただければと思います。

-ライフ