サイト改善 / 制作公開日: 2026.05.08

WordPressにお問い合わせフォームを設置する方法｜Contact Form 7の設定からカスタマイズまで

Webサイトにおけるお問い合わせフォームは、ユーザーとの最初の接点であり、コンバージョンの要です。フォームの使いやすさがCVR（コンバージョン率）を大きく左右するにもかかわらず、適切に設計・運用されていないケースが少なくありません。

本記事では、WordPressで最もポピュラーなフォームプラグイン「Contact Form 7」を中心に、導入手順からカスタマイズ方法、フォーム最適化（EFO）のポイントまでを詳しく解説します。WordPress初心者の方でも手順通りに進めれば、確実にフォームを設置できます。

この記事の目次

お問い合わせフォーム設置の重要性とCVRへの影響

お問い合わせフォームは、Webサイトの「出口戦略」として極めて重要な役割を果たします。ここではその重要性と、CVRに与える影響を整理します。

フォームがCVRに直結する理由

サイト訪問者がサービスに興味を持っても、問い合わせ手段が分かりにくかったり、フォームが使いにくかったりすると、その場で離脱してしまいます。実際、フォームの入力項目を最適化するだけでCVRが30%以上向上した事例も報告されています。フォームは「設置すればよい」ものではなく、CVR改善の重要な施策領域です。

メールアドレスの直接記載によるリスク

フォームを設置せずメールアドレスを直接記載しているサイトもありますが、これにはスパムメールの増加やユーザビリティの低下といったデメリットがあります。フォームを設置すれば、必要な情報を確実に取得でき、スパム対策も行えます。

問い合わせデータの活用

フォーム経由で取得した問い合わせデータは、ユーザーのニーズを把握するための貴重な情報源です。どのページから問い合わせが来ているか、どんな質問が多いかを分析することで、サイト改善やサービス改善に活かせます。

主要フォームプラグインの比較

WordPressには多くのフォームプラグインがありますが、ここでは代表的な3つを比較します。

Contact Form 7

Contact Form 7は、WordPressのフォームプラグインとして最も広く利用されています。有効インストール数は500万以上で、日本語環境での情報も豊富です。無料で使え、HTMLの知識があればカスタマイズの自由度も高いのが特徴です。ただし、デフォルトでは確認画面やフォームのビジュアル編集機能がなく、拡張プラグインで対応する必要があります。

MW WP Form

MW WP Formは日本人開発者によるプラグインで、確認画面と完了画面を標準搭載しているのが最大の特徴です。日本のビジネス慣習（送信前の確認画面表示）に合致しており、国内の企業サイトで多く採用されています。ただし、2023年に開発終了がアナウンスされており、新規での採用は慎重に検討する必要があります。

WPForms

WPFormsはドラッグ&ドロップ操作でフォームを作成できるプラグインです。無料版（WPForms Lite）でも基本的なフォーム作成が可能で、有料版ではファイルアップロードや条件分岐、決済連携などの高度な機能が利用できます。ビジュアル編集に優れているため、コーディング知識がない方でも直感的にフォームを作れます。

プラグイン選定のポイント

フォームプラグインの選定は、以下の基準で判断するとよいでしょう。

カスタマイズ性重視：Contact Form 7（HTML/CSSの知識があれば自由自在）
確認画面必須：WPFormsの有料版、または別途プラグインと組み合わせ
簡単操作重視：WPForms（ドラッグ&ドロップ）
コスト重視：Contact Form 7（完全無料）

Contact Form 7の導入手順

ここからは、最もポピュラーなContact Form 7の導入手順を、ステップごとに詳しく解説します。

ステップ1：プラグインのインストールと有効化

WordPress管理画面から「プラグイン」→「新規追加」を選択し、検索ボックスに「Contact Form 7」と入力します。検索結果に表示されたプラグインの「今すぐインストール」をクリックし、インストール完了後に「有効化」をクリックします。有効化すると、管理画面の左メニューに「お問い合わせ」の項目が追加されます。

ステップ2：フォームの作成

「お問い合わせ」→「新規追加」をクリックし、フォーム名を入力します。デフォルトで「氏名」「メールアドレス」「題名」「メッセージ本文」のフィールドが用意されていますが、用途に応じてフィールドを追加・変更しましょう。一般的な企業サイトでは、以下のフィールドを設けることが多いです。

お名前（必須）
会社名
メールアドレス（必須）
電話番号
お問い合わせ内容の種別（ドロップダウンメニュー）
お問い合わせ内容（テキストエリア、必須）
個人情報の取り扱いへの同意（チェックボックス、必須）

ステップ3：固定ページへの設置

フォーム保存後に表示されるショートコード（

エラー: コンタクトフォームが見つかりません。

）をコピーし、固定ページに貼り付けます。ブロックエディタの場合は「ショートコード」ブロックを使用するか、Contact Form 7専用ブロックを使用します。ページのURLスラッグは「contact」や「inquiry」など分かりやすいものに設定しましょう。

ステップ4：メール設定

フォームの「メール」タブで、通知メールの設定を行います。

送信先：問い合わせを受け取るメールアドレス（複数設定可能）
送信元：サイトのドメインメールアドレス
題名：「【お問い合わせ】[your-subject]」のような形式
本文：フォームの各フィールドのタグを使って通知メール本文を構成

メール(2)を有効にすると、送信者への自動返信メールも設定できます。自動返信メールには受付確認のメッセージと、問い合わせ内容の控えを含めるのが一般的です。

ステップ5：動作確認

設定が完了したら、実際にフォームを送信して動作を確認します。以下のチェック項目を確認しましょう。

フォームが正しく表示されるか
必須項目のバリデーションが機能するか
送信後のサンクスメッセージが表示されるか
管理者宛の通知メールが届くか
自動返信メールが送信者に届くか
メールの文字化けがないか

Contact Form 7のカスタマイズ

デフォルト設定だけでは物足りない場合のカスタマイズ方法を解説します。

確認画面の追加

Contact Form 7にはデフォルトで確認画面がありません。確認画面を追加するには、「Contact Form 7 Multi-Step Forms」プラグインを使用する方法が一般的です。このプラグインを導入すると、入力→確認→完了のステップ形式のフォームを実現できます。日本のユーザーは送信前に確認画面を求める傾向が強いため、BtoB向けサイトでは特に有効です。

バリデーションの強化

デフォルトのバリデーションに加え、電話番号の桁数チェックやメールアドレスの再入力確認など、カスタムバリデーションを追加できます。functions.phpにフィルターフックを記述する方法と、JavaScriptでフロントエンドバリデーションを実装する方法があります。リアルタイムバリデーション（入力中にエラーを表示）を実装すると、ユーザビリティが大幅に向上します。

自動返信メールのカスタマイズ

自動返信メールは、ユーザーとの最初のコミュニケーションです。テンプレート的な文面ではなく、ブランドの個性が伝わるメッセージを心がけましょう。HTML形式のメールにしたい場合は、メール設定の「HTML形式のメールを使用する」にチェックを入れ、本文にHTMLタグを記述します。

reCAPTCHAの設置によるスパム対策

フォームスパムを防止するために、Google reCAPTCHAの導入を推奨します。Contact Form 7はreCAPTCHA v3に標準対応しており、「お問い合わせ」→「インテグレーション」からサイトキーとシークレットキーを設定するだけで有効になります。reCAPTCHA v3はユーザーの操作を妨げない（チェックボックスやパズルが不要な）仕組みで、UXを損なわずにスパム対策が可能です。

サンクスページへのリダイレクト

Contact Form 7のデフォルトでは送信後にメッセージが表示されるだけですが、サンクスページにリダイレクトすることで、GA4でのコンバージョン計測が容易になります。JavaScriptのイベントリスナーを使い、フォーム送信成功時にリダイレクト処理を追加します。

フォーム最適化のポイント（EFOの観点）

フォームを設置しただけでは十分ではありません。EFO（エントリーフォーム最適化）の観点から、離脱を防ぎCVRを最大化するためのポイントを解説します。

入力項目を必要最小限にする

フォームの入力項目が1つ増えるごとに、CVRは約5〜10%低下するとされています。「あると便利」程度の項目は思い切って削除し、本当に必要な情報だけを求めましょう。初回の問い合わせでは「名前」「メールアドレス」「問い合わせ内容」の3項目で十分なケースも多いです。

入力ストレスを軽減する

ユーザーの入力ストレスを軽減するための具体的な施策を実施しましょう。

プレースホルダーの活用：入力例を表示して何を入力すべきか明示
入力形式の自動変換：全角/半角の自動変換
郵便番号からの住所自動入力：住所入力の手間を削減
ラベルとフィールドの近接配置：どのラベルがどのフィールドに対応するか明確に
タップしやすいフィールドサイズ：モバイルでの操作性を確保（高さ44px以上推奨）

エラーメッセージを分かりやすくする

「入力エラーがあります」という曖昧なメッセージではなく、「メールアドレスの形式が正しくありません。example@domain.comの形式で入力してください」のように、具体的な修正方法を示しましょう。エラーは該当フィールドの直下に赤字で表示するのが一般的です。

送信ボタンの最適化

送信ボタンは「送信する」よりも「無料で相談する」「資料をダウンロードする」など、ユーザーが得られる価値を明示した文言にしましょう。ボタンの色はページ内で最も目立つ色にし、マウスホバー時のアニメーションで「クリックできる」ことを視覚的に示します。

プライバシーポリシーへの同意導線

個人情報保護法の観点から、フォーム送信前にプライバシーポリシーへの同意を求めることが推奨されます。プライバシーポリシーへのリンクを設け、チェックボックスで同意を取得する形式が一般的です。ただし、過剰な同意ステップは離脱の原因になるため、バランスを考慮しましょう。

フォームのアクセシビリティ対応

スクリーンリーダーへの対応（適切なlabel要素の設定）、キーボード操作への対応、コントラスト比の確保など、アクセシビリティに配慮したフォーム設計も重要です。これはユーザビリティの向上にもつながり、結果的にCVR改善に貢献します。WordPressのSEO対策と合わせて、サイト全体のユーザー体験を向上させましょう。

ヒトノテが支援した株式会社KG情報様では、問い合わせフォームを含むUI/UX全体の最適化により、問い合わせ数が前年比181%に成長しました。フォームの項目数削減や入力補助の導入だけでなく、フォームに至るまでの導線設計の改善が大きな効果を生んでいます。フォーム単体の改善と合わせて、サイト全体のCVR改善を検討することをお勧めします。

まとめ

WordPressへのお問い合わせフォーム設置は、Contact Form 7を使えば無料で簡単に実現できます。インストールからフォーム作成、固定ページへの設置、メール設定まで、手順通りに進めれば初心者でも確実に設置可能です。

ただし、フォームを設置するだけでは不十分です。確認画面の追加、reCAPTCHAによるスパム対策、リアルタイムバリデーションの実装など、ユーザビリティとセキュリティを高めるカスタマイズを行いましょう。さらに、EFOの観点から入力項目の最小化やエラーメッセージの改善を行うことで、CVRの最大化を目指せます。

フォームの設計・最適化でお悩みの場合は、ヒトノテにお気軽にご相談ください。フォーム改善からサイト全体のCVR向上まで、トータルでサポートいたします。