お問い合わせフォームContact Form 7とは？初期設定やサンクスページの設定方法を解説
サイトにお問い合わせフォームを設置する際におすすめのプラグインが「Contact Form 7」です。自動返信メールやサンクスページの機能が備わっており、お問い合わせフォームを作成する他のプラグインより優れた要素が多いといえます。
そこで本記事では、Contact Form 7の基礎・カスタマイズの設定方法について詳しく解説していきます。
目次
Contact Form 7とは？
Contact Form 7とは、サイトのお問い合わせフォームを作成する際に活用するWordPressのプラグインです。サイトを閲覧しているユーザーや既存客など、サイト運営には問い合わせフォームは欠かせない機能といえるでしょう。
また、問い合わせフォームだけでなく、ユーザーのフォーム入力後に返信する「自動返信メール設定」や「サンクスページ」としての役割も持ちます。
他にもお問い合わせフォームを設置するプラグインや方法はいくつかありますが、機能性や利便性で考えるならばContact Form 7はおすすめできるプラグインです。
Contact Form 7の初期設定
「Contact Form 7」プラグインでは大きく分けて4つの設定があります。
設定できる項目は多いですが、すべての設定が必須というわけではありません。運営しているサイトによっても必要な設定、不必要な設定があるため、項目ごとに考えながら進めていきましょう。
ここでは、初期設定について詳しく解説していきます。
プラグインのインストール
ますはWordPressでプラグインをインストールしましょう。
インストール方法は以下の手順です。
- WordPressサイトの管理画面にログイン
- プラグインのメニュー欄から「新規追加」を選択
- 「Contact Form 7」を検索し、インストール・有効化
WordPress管理画面に「お問い合わせ」のメニュー欄が追加され「Contact Form 7」が表示していれば、インストール完了です。
お問い合わせフォームの作成
インストール後は、早速お問い合わせフォームを作成していきましょう。
まずはWordPressのダッシュボードからContact Form 7を開きます。設定画面に表示されている「新規追加」をクリックしましょう。
その後「コンタクトフォームの追加」が表示されるため、テンプレートに沿って項目を入力していきます。
テンプレートで設定できる項目は以下のとおりです。
- お名前の入力欄
- メッセージ本文の入力欄
- 題名の入力欄
- メールアドレスの入力欄
- 送信ボタン
テンプレートの内容だけでも、必要最低限のお問い合わせフォームが完成できます。
ただし他の項目も追加したい場合や「自動返信メール」や「サンクスページ」の機能を加えたい場合は、後述のカスタマイズ設定等も行っていきましょう。
Contact Form 7のカスタマイズ設定
カスタマイズの設定では、合計で10項目の追加が行えます。
- 電話番号・URL設定
- テキストエリア設定
- ファイル設定
- 日付設定
- チェックボックス設定
- ラジオボタン設定
- ドロップボタン設定
- 送信ボタン設定
- 必須項目設定
- 承諾確認設定
各項目の表示内容や設定方法を解説していきますので、必要な項目は問い合わせフォームに追加していきましょう。
電話番号・URL設定
電話番号とURLの項目を加えたい場合には、それぞれのボタンをクリックし追加しましょう。電話番号とURLの欄では基本的に同じ設定方法となり、テキストを入力する項目です。
デフォルト値には入力内容や入力例を表示できます。なかには項目欄を無視して間違った内容を入力するユーザーもいるため、デフォルト値を設定しておくと安心できるでしょう。
またAkismetの設定が行われていれば「送信者の名前入力」にチェックを入れることで、スパムメール対策が行えます。
海外からのスパムメールが送られてくることも多いため、余裕があれば設定することをおすすめします。
テキストエリア設定
質問やお問い合わせ理由など指定した内容の項目が作成する際は、テキストエリア設定が活用できます。
また他のテキスト項目とは違って、数行の記入欄を設けられる点がテキストエリアの特徴です。
基本的な設定内容は、前述の「電話番号・URL設定」と同じになります。そのため内容に応じてデフォルト値の設定などを行うようにしましょう。
ファイル設定
ファイル設定では、身分証明者や履歴書などの添付欄を作成できます。ファイルサイズも決められますが、Byte(バイト)数で表示させる点には注意をしましょう。
Byte(バイト)数
- 1MB ＝ 1048576Byte
- 5MB ＝ 5242880Byte
- 10MB ＝ 10485760Byte
- 20MB ＝ 20971520Byte
またファイルサイズ以外にも、ファイル形式を指定できます。複数のファイルサイズを指定する場合には「|」で区切りましょう。
日付設定
日付に関する項目を加えたい場合には、日付ボタンを追加しましょう。日付設定では「年(西暦)/月/日」の項目が表示される仕組みです。
また、生年月日の上限と下限を設けられます。年齢制限がある場合などには使い勝手が良く、有効活用できる機能になります。
チェックボックス設定
指定した項目の選択肢を作りユーザーにチェックの有無で回答させる際は、チェックボックス設定が活用できます。
また一つの回答だけでなく、複数回答に該当する場合などで有効活用できる機能といえるでしょう。チェックボックスの設定画面では、まずオプション欄に表示させたい項目を箇条書きで入力します。
またオプション欄の下には、3つの機能に関するチェックボックスがあります。
- ラベルを前にする：チェックボックスを文字列の右に配置する
- abel要素で囲む：入力した項目とチェックボックスの関連付け
- チェックボックスの排他化：選択肢から一つのみを選ばせる
基本的には「abel要素」にはチェックを入れ、状況に合わせて「排他化」も設定しましょう。
ラジオボタン設定
ラジオボタン設定では、指定した項目の選択肢を作り、ユーザーに一つの回答を選ばせることができます。チェックボックス設定と同様に、オプション欄に表示させたい項目を箇条書きで入力しましょう。
使い方としては、好きな選択肢で回答欄を作る方法以外にも「はい」か「いいえ」の2択を選ばせる方法もあります。
ラジオボタンは使い道も多く、アンケートなどの簡易的な設問に適している機能です。
ドロップボタン設定
ドロップボタン設定は、複数の選択肢をメニューとして表示させ、ユーザーに一つの回答を選ばせることができます。
ラジオボタン同様に使用されることが多く、有効活用しやすい機能の一つです。
特に選択肢が多い設問の場合には適している設定といえます。
たとえば東京都23区のなかから住居地を選ばせる際、ラジオボタンやチェックボックスでは項目が多すぎるため、全体的に見づらいお問い合わせフォームとなるでしょう。
しかしドロップボタンはクリックされた時にメニューが表示されるため、通常は邪魔に感じることがありません。
お問い合わせフォームのデザインを損ねることがないため、他の設定で選択肢が多いと感じるような場合には、積極的にドロップボタンの活用をおすすめします。
送信ボタン設定
送信ボタン設定では、好きな言葉でボタンの配置が行えます。初期設定で加わっている項目ではありますが、さまざまな用途で活用できる点が特徴です。
送信ボタンのカスタマイズ例
- 送信
- 申し込み
- 問い合わせ
実際に利用するうえでは、初期設定の「送信」でも問題ありません。しかしお問い合わせ内容に合わせてカスタマイズすることで、より多くのクリック獲得につながる可能性もあります。
お問い合わせにつながる重要部分となるため、複数の文言でテストを行い、最適な送信ボタン設定を目指していきましょう。
必須項目設定
必須項目の設定は、ユーザーからの回答を必須にするための機能です。
必須項目という専用の設定画面が用意されているわけではなく、各項目の設定画面上でチェックボックスとして表示されています。
最近のアンケートやフォームではほとんどが必須項目を設定しているため、何も設定していないと空欄で提出するユーザーも多いと考えましょう。
そのため回答が必要な項目には、かならず必須項目の設定を行うことが重要です。
承諾確認設定
承諾確認設定は、送信ボタンの直前に用意されているチェックボックスの欄が該当します。
「個人情報の扱い方に関して」など、ユーザーからの同意や承諾を得る際に使われる機能です。
一見不必要に感じる設定ではありますが、近年のインターネット社会であれば、さまざまな規約が重要視されています。
特に個人情報に関する内容は漏洩が許されないため、サイトや企業の規模の関係なく、承諾確認設定を活用して承諾を得ることをおすすめします。
Contact Form 7の自動返信メール設定
自動返信メールとは、お問い合わせフォームを入力したユーザーに向けて、問い合わせ内容の確認や問い合わせを受け付けたことを示す役割をもちます。また、ユーザーと管理者の両方に設定できるため、お問い合わせフォームの管理を円滑するためにも重要な機能といえるでしょう。
ここでは、自動返信メール設定について詳しく解説していきます。
メール (2)を設定
自動返信メールを設定するには、まずは何かしらのお問い合わせフォームを作成している必要があります。お問い合わせフォームが作成できている場合には、再度フォームの設定画面を表示させましょう。
設定画面を表示できたら、メールタブを選択します。その後下にスクロールし「メール(2)」をクリックしましょう。
新たにメールの設定画面が表示されるため、自動返信メールの設定を入力していきます。
基本的には流れに沿って入力すれば問題ありません。「追加ヘッダー」では自動返信メールに対する、返信の送付先を指定する設定となります。
返信メッセージの編集
最も重要な返信メッセージの内容ですが、分かりやすく簡易的に作成しましょう。なぜなら返信メッセージの目的は確認作業によってユーザーへ安心感を与えることだからです。
そのため多少ならまだしも、返信メッセージをメインに新たな集客を行うなど、情報が多すぎるような状態は避けましょう。無駄に情報が多いとユーザーへの不快感につながる可能性もあるため、まずはお問い合わせ内容を解決し、ユーザーの満足度を高めることが重要です。
サンクスページ設定
サンクスページとは問い合わせフォームの入力後に「お問い合わせありがとうございます。」などと表示されるページのことです。ユーザーが最終的に到達するページになるため、感謝の気持ちやさらなる興味を持たせることができます。
Contact Form 7の標準機能ではサンクスページを設定できません。しかしリダイレクト設定によって別途で作成したサンクスページへ転送できるため、お問い合わせフォームからそのままつなげられます。
ここでは、サンクスページ設定について詳しく解説していきます。
サンクスページの作成
まずは転送先のサンクスページを作成しましょう。一般的な記事として作成するだけとなり、問い合わせに関する感謝の言葉を表示させましょう。
どの程度の期間で返信するかなどの記載があれば、ユーザーにも安心感を与えられます。
リダイレクト設定
ここからはContact Form 7の設定を行っていきます。
WordPressにログインし「Contact Form 7」の設定画面を開きましょう。
続いて作成済みの問い合わせの設定画面を開き「フォーム」の一番下に、以下のコードを追加します。
<script>
document.addEventListener( ‘wpcf7mailsent’, function( event ) {
location = ‘example’;
}, false );
</script>
「example」の欄に、作成したサンクスページのURLを入力すれば完了です。URLはかならず「https://〜」から入力しましょう。
初期設定のメッセージを編集
最後にContact Form 7上で、問い合わせフォーム入力後のメッセージを編集します。
何も編集しないままだと、サンクスページと同じ内容のメッセージが表示されてしまうため、ユーザーに違和感を与えてしまうかもしれません。
そのため作成済みの問い合わせの設定画面を開き「メッセージ」欄の最上部の項目を削除しましょう。
「送信中」などの文言があれば、自然な流れでサンクスページへ転送が行なえます。
Contact Form 7を便利にするおすすめプラグイン
さまざまな機能が備わっているContact Form 7ですが、他のプラグインと組み合わせることで、より効果的な問い合わせフォームが作成できます。特に問い合わせフォームで避けては通れないスパム被害は対策が必須のため、一緒に専用プラグインの導入が効果的です。
ここでは、Contact Form 7を便利にするおすすめプラグインについて詳しく解説していきます。
Invisible reCaptcha
Invisible reCaptchaは、自動botや悪質なスパムを排除するためのプラグインです。人間の操作かbotの操作かを自動で判断できるため、ほとんどのスパムを排除できるといっても過言ではありません。
仮にContact Form 7のみであれば、海外からの自動botをはじめ、多くのスパムが届いてしまいます。
実際、気づけばコメント欄がスパムで埋まってしまうといったこともあるではないでしょうか。
特に問い合わせフォームはスパムが届きやすいため、強固な対策が必須といえます。
Invisible reCaptchaであれば簡単な設定でスパム対策が行えるため、問い合わせフォームを設置する際は組み合わせて導入することがおすすめです。
Contact Form 7 add confirm
Contact Form 7 add confirmはお問い合わせフォームの入力時に、確認画面を表示させるためのプラグインです。
Contact Form 7のみの場合、設定した送信ボタンが押されると、そのまま入力内容が送信される仕組みとなります。
問い合わせフォームの機能としては問題ありませんが、確認画面がないとユーザーの入力ミスなどには対応できません。
特に問い合わせフォームは簡単に入力できるため、何も読み返さずに送信するユーザーも多くいるでしょう。
また多くのユーザーに入力ミスがあると運営の負担が多くなってしまいます。
そのためユーザーの入力ミスを無くし少しでもスムーズにサイト運営したい場合には、確認画面を表示させる Contact Form 7 add confirmの活用がおすすめです。
【まとめ】本記事ではContact Form 7の基礎設定からカスタマイズ設定について、詳しく解説してきました。Contact Form 7では多くの項目が追加できるため、自分好みのお問い合わせフォームが作成できます。またリダイレクト設定によってサンクスページも作成できるため、どのサイトでも活用しやすいプラグインといえるでしょう。さらにより良いフォームを考える場合は、本記事で紹介したプラグインとの組み合わせもご活用ください。
この記事の監修者
日本大学法学部卒業、広告代理店で12年間働いている間、SEOと出会い、SEO草創期からSEO研究を始める。SEOを独学で研究し100以上のサイトで実験と検証を繰り返しました。そのノウハウを元に起業し現在、10期目。営業、SEOコンサル、WEB解析（Googleアナリティクス個人認定資格GAIQ保持）コーディング、サイト制作となんでもこなす。会社としては今まで1000以上のサイトのSEO対策を手掛けてきました。
