WordPressで作成したブログやサイトに、問い合わせフォームを設置する方法を紹介します。おすすめのプラグインを使えば、難しい専門知識は必要ありません。メールフォームの編集だけでなく、スパムメール対策も簡単にできます。

WordPressブログに問い合わせフォームを設置しよう

なぜ問い合わせフォームを設置すべきなのか?

WordPressで作成したブログ・サイトの訪問者から

  • 記事の内容について意見や感想を聞く
  • 商品やサービスなどの問い合わせを受け付ける

ためには、問い合わせフォーム(メールフォーム)を設置するのがおすすめです。

WordPress講師

WordPressには「コメント」機能がありますが、通常その内容はWebページ上に公開されるため、投稿をためらってしまう訪問者がいるかもしれません。

最近ではSNSを通じてやり取りするケースも多いですが、より幅広い人たちとのコミュニケーションを図るためにも、メールフォームの設置が効果的です。

メールフォームとは

メールフォームは、メールソフトやアプリを利用しなくてもWebページ上のフォーム(入力欄)からメールを送信できる機能です。あらかじめ入力項目を用意できるため、入力漏れを防ぎやすいというメリットがあります。

WordPress本体にはメールフォームを表示させる機能がないため、別途用意しなければなりません。メールフォームを自作する場合はプログラミングなどに関する専門知識が必要ですが、プラグインを使えばメールフォームを簡単に設置することができます。

この記事では、初心者さんでも簡単に問い合わせフォームを設置できるプラグイン「Contact Form 7」の使い方を説明します。

Contact Form 7で作成できるフォームの表示例
Contact Form 7で作成できるフォームの表示例

問い合わせフォームを設置する方法

WordPressブログに問い合わせフォームを設置するための主な手順は、以下のとおりです。

  1. プラグインのインストールと有効化
  2. メールフォームの編集
  3. 問い合わせページの作成
  4. メールのテスト送信
  5. 送信メール・自動返信メールの設定
  6. メッセージの設定

1.プラグインのインストールと有効化

Contact Form 7 プラグインは、WordPress管理画面上で簡単にインストールすることができます。管理画面メニュー[プラグイン]→[新規追加]をクリックします。

プラグイン新規追加画面の開き方

プラグイン名「Contact Form 7」で検索し、[今すぐインストール]をクリックします。

Contact Form 7 プラグインのインストール

インストールが完了したら[有効化]をクリックします。

Contact Form 7 プラグインの有効化

有効化が完了すると、管理画面メニューに[お問い合わせ]が追加されます。この中の[新規追加]をクリックします。

問い合わせフォームの新規追加

「コンタクトフォームを追加」画面が開きます。ここでは、以下の4つのタブが用意されています。

「コンタクトフォームを追加」画面
  • フォーム・・・・
    メールフォームの編集
  • メール・・・・・
    送信メール/自動返信メールの設定
  • メッセージ・・・
    メール送信後に表示するメッセージの設定
  • その他の設定・・
    上級者向けの設定

2.メールフォームの編集

コンタクトフォーム追加画面の「フォーム」タブでは、メールフォームを編集することができます。

コンタクトフォームを追加画面の「フォーム」タブ

まず、タイトルを入力します。その下には、フォームのサンプルがあらかじめ用意されています。「氏名」「メールアドレス」など一般的な入力項目が含まれているので、このまま編集せずに利用しても問題ありません。タイトル入力や編集が終わったら、必ず保存をクリックしましょう。

この画面では、必要に応じてメールフォームの項目を追加することができます。ただ項目が多すぎると、訪問者は入力が面倒になって問い合わせをやめてしまうかもしれません。項目の追加は、必要最低限に絞りましょう。

項目を追加する方法

メールフォームを編集するにはコードを書き換えなければなりませんが、入力補助用の各種ボタンを使うと簡単に項目を追加できます。

「フォーム」タブの入力補助用のボタン

簡単な例として、「年齢」を選択できる項目を追加してみます。
「年齢」と入力して改行し、ラジオボタンをクリックします。

「年齢」と入力して改行し、ラジオボタンをクリック

名前には「your-age」と入力し、オプションには選択肢を入力します。選択肢は、1つずつ改行してください。入力が終わったら、タグを挿入をクリックします。

名前とオプション入力後、タグを挿入

項目が追加できたら、保存をクリックします。

項目追加後、保存をクリック

メールフォームを編集し保存を行うと、ショートコードが表示されます。ショートコードは、次の「3.問い合わせページの作成」で使用します。ショートコードをコピーしておきましょう。

メールフォームのショートコードをコピー

3.問い合わせページの作成

問い合わせページ(メールフォームを表示するページ)を、「固定ページ」機能を使って作成します。
管理画面メニュー[固定ページ]→[新規追加]をクリックします。

固定ページの新規追加方法

ページのタイトルや本文を入力し、新しいブロックを追加します。

問い合わせページのタイトルと本文を入力

前の手順でコピーしたショートコードを貼り付けます。

メールフォームのショートコードを貼り付け

パーマリンクを設定(例:contact)して、問い合わせページを公開します。

問い合わせページのパーマリンク設定・公開
WordPress講師

問い合わせページが用意できました。続いて、メールフォームの動作確認をしましょう。

4.メールのテスト送信

先ほど公開した問い合わせページを開き、メールフォームに項目を入力して[送信]をクリックします。

必須項目を入力して送信

エラーの動作確認も!

必須項目をあえて空欄にした状態で[送信]をクリックして、エラーのメッセージが表示されるかチェックしておきましょう。

問い合わせページのエラーの動作確認

送信されたメールを確認してみましょう。

送信されたメールを確認
メールの送信先は?

WordPress管理画面[設定]→[一般]の管理者メールアドレスに登録されているアドレスに送信されます。

WordPress講師

送信メールの内容は、カスタマイズできます。また、送信者に対して自動返信メールを送ることもできます。くわしくは、次の手順で説明します。

5.送信メール・自動返信メールの設定

Contact Form 7 プラグインの編集画面に戻りましょう。
まず管理画面メニュー[お問い合わせ]をクリックしてコンタクトフォーム一覧画面を開き、次に編集したいフォームのタイトルをクリックします。

Contact Form 7 プラグインの編集画面に戻る方法

コンタクトフォーム編集画面の「メール」タブでは、送信メールや自動返信メールの内容を設定することができます。

コンタクトフォームを追加画面の「メール」タブ
送信メール
メールフォームからサイト管理者(=あなた)宛に送信されるメール
自動返信メール
送信内容を確認できるよう、送信者(=サイト訪問者)宛に自動送信するメール

5-1.送信メールの設定

「1.メールフォームの編集」で用意されていたサンプルを変更をしなかった場合は、送信メールの内容についてもサンプルをそのまま利用して問題ありません。

しかし、メールフォームに新しい項目を追加した場合、送信者が入力した内容をメールに反映させるためには、プラグイン独自の「タグ」を挿入する必要があります。

たとえば、「1.メールフォームの編集」のカスタマイズ例のように「年齢」の項目を追加し、名前を「your-age」とした場合、タグ[your-age]を任意の場所に追加します。

コンタクトフォームを追加画面で送信メールを設定
設定を変更した場合は、保存のクリックを忘れずに。

5-2.自動返信メールの設定

自動返信メールは、初期状態では送信されない設定になっています。自動返信メールを有効にする場合は、画面下部の[メール(2)を使用]にチェックを入れます。

自動返信メールの有効化は[メール(2)]にチェック

チェックを入れると、自動返信メールの編集画面が表示されます。ここでもサンプルが用意されていますが、メッセージ本文が少し素っ気ないので、適宜変更されることをおすすめします。

メッセージ本文のカスタマイズ例

[your-name] 様

この度は[_site_title] のお問い合わせフォームをご利用いただき、ありがとうございます。

ご連絡いただいた内容は、以下のとおりです。

お名前:[your-name] 様
年齢:[your-age]
メールアドレス:[your-email]
題名:[your-subject]
お問い合わせの内容:
[your-message]

返信までしばらくお待ち下さい。


このメールは [_site_title] ([_site_url]) のお問い合わせフォームから送信されました

設定を変更した場合は、保存のクリックを忘れずに。

自動返信メールを有効化・編集した後は、再びメールのテスト送信をしましょう。このとき入力するメールアドレスは、必ず自分のメールアドレスを使用してください。

自動返信メールのカスタマイズ結果
先ほど紹介したカスタマイズ例は、このようにメールに反映されました

6.メッセージの設定

コンタクトフォーム編集画面の「メッセージ」タブでは、サイト訪問者がメールフォームから送信した後に表示するメッセージの内容を設定できます。さまざまな状況に応じたメッセージ内容が用意されているので、必要に応じて変更してください。

コンタクトフォームを追加画面の「メッセージ」タブ
「その他の設定」について
コンタクトフォームを追加画面の「その他の設定」タブ

コードを記述することによってカスタマイズできる、上級者向けの機能です。上の画面で「その他の機能」のリンクをクリックすると、詳しい使い方を確認できます。

スパムメール対策

スパムメールとは、広告宣伝目的で無差別に送りつけられる迷惑メールのことです。

ブログにメールフォームを設置するということは、訪問者とのやり取りができるメリットがある一方で、スパムメールを送られる可能性があるというデメリットもあります。

スパムメールを防ぐために有効な方法の1つに、「reCAPTCHA(リキャプチャ)」があります。Googleが提供するスパム対策サービスで、無料で利用することができます。

reCAPTCHA公式サイト

reCAPTCHAの利用方法については、Contact Form 7 プラグインの公式ヘルプにくわしく書かれていますので、下記を参照してください。

まとめ

ブログやサイトの訪問者とやり取りするには、問い合わせフォーム(メールフォーム)を設置するのがおすすめです。

WordPressでは、プラグインを使うと初心者さんでも簡単に問い合わせフォームを設置することができます。おすすめは「Contact Form 7」です。メールフォームの編集や、送信メール・自動返信メールの設定ができます。

問い合わせフォームを設置した後は、スパムメール対策も忘れずに。