Blog

ブログ

コピペでOK!ホームページのお問い合わせフォーム設置方法|HTML知識不要で5分で完了

コピペでOK!ホームページのお問い合わせフォーム設置方法|HTML知識不要で5分で完了

ホームページにお問い合わせフォームを設置したいけれど、「HTMLの知識がないから難しそう」「何から始めればいいかわからない」と悩んでいませんか?実は、お問い合わせフォームは無料ツールやプラグインを使えば、専門知識がなくても誰でも簡単に設置できます。この記事では、Googleフォームを使ったコピペでの設置方法から、WordPressの人気プラグイン「Contact Form 7」の使い方まで、具体的な手順を画像付きで分かりやすく解説。さらに、問い合わせを増やすコツや必須のセキュリティ対策も網羅しているため、この記事を読めば、初心者でも安全で成果につながるお問い合わせフォームをすぐに作成できます。

目次

1. はじめに|ホームページにお問い合わせフォームはなぜ必要か

ホームページを開設する多くの目的は、新規顧客の獲得やビジネスチャンスの創出にあります。その重要な役割を担うのが「お問い合わせフォーム」です。単に連絡先を載せるだけでなく、戦略的にフォームを設置することで、24時間365日、自動で見込み客(リード)を獲得し続ける強力な営業ツールとして機能します。電話番号を記載するだけでは取りこぼしてしまう可能性のある貴重な機会を、お問い合わせフォームが確実に捉えてくれるのです。

この章では、なぜホームページにお問い合わせフォームが必要不可欠なのか、その具体的な理由とメリットを詳しく解説します。

1.1 ビジネスチャンスを最大化する24時間の受付窓口

ユーザーがあなたのサービスや商品に興味を持つタイミングは、企業の営業時間内とは限りません。深夜や早朝、休日など、時間を選ばずに問い合わせたいと考えるユーザーは数多く存在します。電話対応のみの場合、営業時間外の問い合わせはすべて機会損失となってしまいます。

お問い合わせフォームを設置すれば、ユーザーが思い立ったその瞬間にアクションを起こせる窓口となり、時差や曜日に縛られることなく、あらゆるビジネスチャンスを逃しません。

1.2 顧客情報を正確に収集・管理できる

電話でのヒアリングでは、聞き間違いやメモの取り忘れといった人為的なミスが発生しがちです。特に、会社名やメールアドレス、複雑な名前などの固有名詞は、間違いが起こりやすいポイントです。

その点、お問い合わせフォームであれば、ユーザー自身が入力したテキスト情報がそのままデータとして記録されます。これにより、情報の正確性が担保され、後の顧客管理やマーケティング活動へのデータ活用がスムーズになります。必要な情報を漏れなく、かつ正確に収集できる点は、フォーム設置の大きなメリットと言えるでしょう。

1.3 問い合わせの心理的なハードルを下げる

「電話をかけるのは少し緊張する」「要点をまとめて話せるか不安」といった理由で、問い合わせをためらってしまうユーザーは少なくありません。特に若い世代を中心に、電話よりもテキストでのコミュニケーションを好む傾向が強まっています。

お問い合わせフォームは、ユーザーが自分のペースで、時間をかけて内容を整理しながら入力できるため、電話に比べて心理的なハードルが格段に下がります。これにより、これまでなら諦めていたかもしれない潜在的な顧客からのコンタクトを促進する効果が期待できます。

1.4 問い合わせ対応の効率化を実現する

受け付けた問い合わせ内容に応じて、担当部署や担当者が異なるケースは頻繁にあります。お問い合わせフォームに「お問い合わせ種別」のような選択項目を設けることで、内容に応じた担当者へ自動的に通知を振り分ける設定が可能になります。

これにより、社内での取次ぎの手間が省け、担当者が迅速に対応を開始できるため、顧客満足度の向上にも繋がります。電話のように一次対応者が必ず介在する必要がなくなり、組織全体の業務効率が大幅に改善されます。

1.5 電話だけでは不十分?フォーム設置のメリット比較

ホームページにおける「電話」と「お問い合わせフォーム」の役割を比較すると、フォームを設置するメリットはより明確になります。

比較項目お問い合わせフォーム電話
受付時間24時間365日企業の営業時間内のみ
顧客情報の正確性非常に高い(ユーザーが直接入力)聞き間違いなど人為的ミスの可能性あり
対応の効率性高い(自動振り分けやテンプレート返信が可能)低い(一次対応や取次ぎが発生)
問い合わせのハードル低い(時間や場所を選ばず、心理的負担が少ない)高い(話す内容をまとめる必要があり、緊張感を伴う)
データ管理・活用容易(自動でデータが蓄積され、分析・活用しやすい)困難(手動での入力や転記作業が必要)

このように、お問い合わせフォームは単なる連絡手段ではなく、機会損失の防止、業務効率化、データに基づいたマーケティング戦略の実現など、ビジネスを成長させる上で欠かせない重要な機能です。この記事では、HTMLの知識がない方でも最短5分で設置できる方法から、WordPressを使った本格的なフォームの作り方まで、わかりやすく解説していきます。

2. 【HTML知識不要】Googleフォームを使ったお問い合わせフォームの設置方法

ホームページのお問い合わせフォームは、専門的な知識がないと設置が難しいと思われがちです。しかし、Googleが無料で提供している「Googleフォーム」を使えば、HTMLやプログラミングの知識が一切なくても、誰でも簡単にお問い合わせフォームを作成できます。 この章では、Googleアカウントさえあればすぐに実践できる、Googleフォームの作成からホームページへの埋め込み、そして回答の管理方法までを詳しく解説します。

2.1 Googleフォームを作成する手順

まずは、お問い合わせフォーム本体を作成します。直感的な操作で、必要な項目を自由に追加していくことができます。

  1. Googleドライブにアクセスし、左上の「+ 新規」ボタンから「Googleフォーム」を選択します。 直接Googleフォームのページにアクセスして作成を開始することも可能です。
  2. 「無題のフォーム」と表示されている部分に「お問い合わせフォーム」など、分かりやすいタイトルを入力します。その下の「フォームの説明」には、フォームの目的や回答後の流れなどを記載すると親切です。
  3. 右側の「+」アイコンをクリックして、質問項目を追加します。例えば、「お名前」「メールアドレス」「お問い合わせ内容」など、必要な項目を作成していきましょう。
  4. 各質問項目では、回答形式を選択できます。用途に応じて最適なものを設定してください。代表的な回答形式とその用途回答形式説明と用途記述式1行の短いテキストを入力させたい場合に使います。(例:お名前、会社名)段落複数行にわたる長い文章を入力させたい場合に使います。(例:お問い合わせ内容)ラジオボタン複数の選択肢の中から1つだけを選んでほしい場合に使います。(例:性別、ご希望の連絡方法)チェックボックス複数の選択肢の中から複数回答を許可する場合に使います。(例:興味のあるサービス)プルダウン選択肢が多い場合に、ドロップダウンリストから1つを選んでほしい場合に使います。(例:都道府県)
  5. ユーザーに必ず入力してもらいたい項目は、右下にある「必須」のスイッチをオンにします。
  6. 画面右上のパレットのアイコンから、ヘッダー画像やテーマ色を変更し、ご自身のホームページのデザインに近づけることも可能です。

これらの手順で、フォームの基本的な形が完成します。

2.2 ホームページにフォームを埋め込む手順

作成したGoogleフォームを、ご自身のホームページに表示させるための手順です。発行されるHTMLコードをコピーして貼り付けるだけなので、非常に簡単です。

  1. フォームの編集画面の右上にある、紫色の「送信」ボタンをクリックします。
  2. 「フォームを送信」というウィンドウが表示されたら、「送信方法」の中から「< >」(埋め込みHTML)のアイコンを選択します。
  3. 「HTMLを埋め込む」という項目に表示されるから始まるコードをすべてコピーします。このとき、必要に応じて幅や高さを調整することもできます。
  4. コピーしたコードを、あなたのホームページのHTMLソースコード、または利用しているCMS(コンテンツ管理システム)の「HTMLブロック」や「埋め込み」機能を使って、フォームを表示させたい場所に貼り付けます。

たったこれだけの作業で、ホームページにお問い合わせフォームが設置されます。プレビュー機能などで、実際にフォームが正しく表示されているか確認しましょう。

2.3 フォームの回答をスプレッドシートで管理する方法

Googleフォームの大きなメリットの一つが、回答データをGoogleスプレッドシートで自動的に管理できる点です。 これにより、回答があるたびにリアルタイムでデータが蓄積され、一覧での確認や分析が非常に楽になります。

  1. フォームの編集画面上部にある「回答」タブをクリックします。
  2. 緑色のスプレッドシートのアイコン(「スプレッドシートにリンク」)をクリックします。
  3. 「回答の送信先を選択」というウィンドウで、「新しいスプレッドシートを作成」にチェックを入れ、管理しやすい名前(例:お問い合わせ管理シート)を入力して「作成」ボタンをクリックします。

これで、フォームとスプレッドシートが連携されました。以降、フォームに新しい回答が送信されると、自動でこのスプレッドシートに行が追加されていきます。 また、「回答」タブのその他メニュー(︙)から「新しい回答についてのメール通知を受け取る」を有効にしておけば、お問い合わせがあるたびに指定のメールアドレスで通知を受け取ることができ、迅速な対応につながります。

3. 【WordPress向け】プラグインを使ったお問い合わせフォームの設置方法

WordPressで構築されたホームページに、お問い合わせフォームを設置する最も簡単で高機能な方法は「プラグイン」を利用することです。HTMLやプログラミングの専門知識がなくても、管理画面からの操作だけで本格的なフォームを導入できます。ここでは、数あるプラグインの中でも特に利用者数が多く、信頼性の高い2つの代表的なプラグイン「Contact Form 7」と「MW WP Form」の使い方を詳しく解説します。

どちらのプラグインも無料で高機能ですが、特徴が異なります。以下の比較表を参考に、ご自身のホームページの目的や必要な機能に合わせて選びましょう。

機能Contact Form 7MW WP Form
概要世界で最も利用されているプラグインの一つ。シンプルで柔軟性が高い。日本人が開発したプラグイン。確認画面や完了画面が標準機能として搭載。
確認画面標準では非対応(別途アドオン導入で可能)。標準機能として対応
完了画面メッセージ表示のみ(リダイレクトは追加設定が必要)。標準機能として対応
カスタマイズ性非常に高い。HTMLやCSSで自由にデザイン可能。高い。HTMLでのカスタマイズが可能。
利用者数圧倒的に多い。情報やアドオンが豊富。国内で人気が高い。

※「MW WP Form」は現在、開発が終了しており、WordPressの将来のバージョンで動作しなくなる可能性があります。セキュリティのリスクも考慮し、代替プラグインへの移行も検討することをおすすめします。

3.1 代表的なプラグイン Contact Form 7 の使い方

「Contact Form 7」は、そのシンプルさとカスタマイズの自由度の高さから、世界中のWordPressサイトで利用されている定番のお問い合わせフォームプラグインです。 シンプルなフォームであれば、数ステップで簡単に設置できます。公式ドキュメントはこちらから確認できます。

3.1.1 1. インストールと有効化

WordPressの管理画面にログインし、左側のメニューから「プラグイン」>「新規追加」をクリックします。 検索窓に「Contact Form 7」と入力して検索し、表示されたら「今すぐインストール」をクリック。インストール完了後、「有効化」ボタンをクリックすれば準備完了です。

3.1.2 2. フォームの作成と編集

有効化すると、管理画面メニューに「お問い合わせ」が追加されます。 クリックすると、デフォルトで「コンタクトフォーム 1」というサンプルフォームが作成されています。これを編集するか、「新規追加」で新しいフォームを作成します。「フォーム」タブ内で、HTMLと独自の「フォームタグ」を組み合わせて入力項目を自由にカスタマイズできます。 テキスト入力欄、メールアドレス、チェックボックス、ドロップダウンメニューなど、様々な項目を簡単に追加可能です。

3.1.3 3. メールの設定

フォームが正しく機能するために最も重要なのが「メール」タブでの設定です。 ここでは、ユーザーからのお問い合わせがあった際に、サイト管理者に通知されるメールの内容を設定します。また、「メール(2)を使用」にチェックを入れることで、問い合わせてきたユーザーに対して自動返信メールを送る設定も可能です。 送信先、送信元、題名、メッセージ本文などの各項目に、フォームタブで設定したフォームタグ(例:[your-name])を埋め込むことで、入力内容をメールに反映させることができます。

3.1.4 4. ホームページへの埋め込み

フォームの作成とメール設定が完了したら、フォーム編集画面の上部に表示されているショートコード(例:

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

)をコピーします。あとは、お問い合わせフォームを設置したい固定ページや投稿の編集画面を開き、本文の表示させたい場所にそのショートコードを貼り付けるだけです。 これでホームページにお問い合わせフォームが表示されます。

3.2 MW WP Form を使った確認画面付きフォームの作り方

「MW WP Form」は、日本のWebサイトで一般的に求められる「入力内容の確認画面」や「送信完了画面」を標準機能で簡単に作成できる国産プラグインです。 ユーザーが入力ミスに気づきやすくなるため、より親切なフォームを構築できます。公式マニュアルはこちらで公開されています。

3.2.1 1. インストールと有効化

Contact Form 7と同様に、WordPress管理画面の「プラグイン」>「新規追加」から「MW WP Form」を検索し、インストール・有効化します。 有効化すると管理画面に「MW WP Form」というメニューが表示されます。

3.2.2 2. フォームの作成とURL設定

「MW WP Form」から「新規追加」をクリックしてフォーム作成画面を開きます。右側にある「フォームタグジェネレーター」を使うと、テキストボックスやメールアドレス、確認・送信ボタンなどのパーツを直感的に追加できます。

このプラグインの最大の特徴は、画面遷移の設定です。あらかじめ「お問い合わせ(入力画面)」「内容確認(確認画面)」「送信完了(完了画面)」の3つの固定ページを作成しておく必要があります。 その後、フォーム編集画面下部にある「URL設定」で、それぞれのページに対応するURLを指定します。 これにより、入力→確認→完了というスムーズな画面遷移が実現します。

3.2.3 3. 確認画面・完了画面の表示設定

確認画面では、ユーザーが入力した内容を表示させる必要があります。これは、フォーム編集画面で設定した各入力項目のname属性を波括弧 `{}` で囲んだタグ(例:{your-name})を、確認画面用の固定ページに記述することで表示できます。また、完了画面には、問い合わせのお礼やその後の流れなどを記載したメッセージを設定します。

3.2.4 4. ホームページへの埋め込み

すべての設定が完了したら、フォーム編集画面の右側に表示されている「フォーム識別子」というショートコードをコピーします。 そして、手順2で作成した「お問い合わせ(入力画面)」用の固定ページの本文に、そのショートコードを貼り付ければ設置完了です。 ユーザーが入力画面から進むと、設定したURLに従って確認画面、完了画面へと自動的に遷移します。

4. お問い合わせフォームで成果を上げるための3つのポイント

お問い合わせフォームは、ただ設置するだけでは十分ではありません。ユーザーが「問い合わせをしたい」と思ったその熱量を逃さず、スムーズに行動完了まで導くことが重要です。ここでは、コンバージョン率(CVR)を向上させ、ビジネスチャンスを最大化するための3つの重要なポイントを解説します。

4.1 入力項目は必要最低限に絞る

ユーザーがフォーム入力を途中で諦めてしまう最大の原因の一つが、「入力項目の多さ」です。入力の手間はユーザーの離脱に直結するため、EFO(入力フォーム最適化)の観点から項目数は可能な限り少なくする必要があります。 まずは「名前」「メールアドレス」「お問い合わせ内容」など、コミュニケーションを取るために絶対に欠かせない情報だけに絞り込みましょう。

特にBtoC向けのフォームでは、住所や電話番号といった個人情報の入力を必須にすると、ユーザーの心理的ハードルが上がり、離脱率が高まる傾向にあります。BtoBの場合でも、「会社名」や「部署名」は必要かもしれませんが、「役職」や「従業員数」などは初回接点では不要なケースがほとんどです。任意項目として設定するか、その後のコミュニケーションの中でヒアリングするようにしましょう。

フォームの種類推奨される最低限の項目離脱に繋がりやすい項目例
一般的なお問い合わせ氏名、メールアドレス、お問い合わせ内容年齢、性別、住所、電話番号、FAX番号
資料請求(BtoB)会社名、氏名、メールアドレス役職、部署名、従業員数、売上規模

入力項目を減らすことは、ユーザーの負担を軽減し、入力完了率を高めるための最も効果的な施策の一つです。

4.2 自動返信メールを設定して安心感を与える

ユーザーがフォームを送信した後、「無事に送信されただろうか」「いつ返事が来るのだろうか」といった不安を感じることがあります。この不安を解消し、企業としての信頼性を高めるために、自動返信メールの設定は不可欠です。 問い合わせ直後に自動返信メールが届けば、ユーザーは「確かに受け付けられた」と安心できます。

効果的な自動返信メールには、以下の要素を盛り込みましょう。

  • 受付完了の明確なメッセージ: 「お問い合わせありがとうございます。以下の内容で受け付けました。」
  • 問い合わせ内容の控え: ユーザーが入力した内容を記載することで、送信内容を再確認できます。
  • 今後の対応と期間の目安: 「担当者より3営業日以内にご返信いたします。」のように具体的な期間を示すことで、ユーザーは安心して待つことができます。
  • 企業の連絡先情報: 会社名、ウェブサイトURL、電話番号などを署名として記載します。

この一手間が、ユーザーの不安を取り除き、丁寧な企業であるという印象を与え、その後の良好な関係構築へと繋がります。

4.3 サンクスページを設置して次の行動を促す

サンクスページ(問い合わせ完了ページ)は、単に感謝を伝えるだけのページではありません。問い合わせというアクションを終えた、最も関心度の高いユーザーに対して次の行動を促す絶好の機会です。 このページを最適化することで、ユーザーとの関係をさらに深めることができます。

サンクスページには、感謝のメッセージと共に、以下のようなコンテンツを設置するのが効果的です。

  • 関連資料やお役立ちコンテンツへの誘導: 問い合わせ内容に関連するブログ記事、導入事例、ホワイトペーパーなどを紹介し、さらなる情報提供を行います。
  • SNSアカウントのフォロー促進: FacebookやX(旧Twitter)、Instagramなどの公式アカウントを紹介し、フォローを促すことで、継続的な接点を持ちます。
  • メールマガジンへの登録案内: 最新情報やお得な情報を届けるメールマガジンへの登録を促します。
  • 人気商品や関連サービスへのリンク: ECサイトであれば、他の人気商品や関連商品を提示することで、クロスセルやアップセルに繋がる可能性があります。

このように、サンクスページを「ゴール」ではなく「新たなスタート地点」と捉えることで、一度のコンバージョンで終わらない、長期的な顧客育成(リードナーチャリング)の第一歩を踏み出すことができます。

5. やっておきたいお問い合わせフォームのセキュリティ対策

お問い合わせフォームは、顧客との重要な接点であると同時に、悪意のある第三者からの攻撃の標的にもなりやすい場所です。セキュリティ対策が不十分だと、個人情報の漏洩やWebサイトの改ざん、大量のスパムメールによる業務妨害など、深刻なリスクを引き起こす可能性があります。 ユーザーに安心してフォームを利用してもらい、企業の信頼性を守るためにも、適切なセキュリティ対策は必須と言えるでしょう。

5.1 SSL/TLS化(HTTPS化)で通信を暗号化する

お問い合わせフォームのセキュリティ対策として、まず基本となるのがSSL/TLS化です。 SSL/TLS(Secure Sockets Layer/Transport Layer Security)とは、インターネット上の通信を暗号化する技術のことです。 これにより、ユーザーがフォームに入力した氏名、メールアドレス、電話番号といった個人情報が、第三者に盗聴されたり、改ざんされたりするのを防ぎます。

SSL/TLS化されたウェブサイトは、URLが「http://」から「https://」に変わり、ブラウザのアドレスバーに鍵マークが表示されます。 これにより、ユーザーは視覚的にサイトの安全性を確認でき、安心して情報を入力できます。現在ではウェブサイト全体の常時SSL化が標準となっており、Googleの検索順位評価にも影響を与えるため、必ず対応しておきましょう。多くのレンタルサーバーでは、無料のSSL証明書を簡単な設定で導入できる機能が提供されています。

5.2 reCAPTCHAを導入してスパムを防ぐ方法

「フォームから海外からの意味不明なメールが大量に届く」といった問題の多くは、bot(ボット)と呼ばれる自動化されたプログラムによるスパムが原因です。 これを放置すると、本当に重要な問い合わせが埋もれてしまったり、サーバーに負荷がかかったりする恐れがあります。そこで有効なのが、Googleが提供する「reCAPTCHA(リキャプチャ)」の導入です。

reCAPTCHAは、アクセスしてきたのが人間なのかbotなのかを判別する仕組みです。 これにより、botによる悪質な投稿を効果的にブロックできます。 現在主流のバージョンには、ユーザーの利便性に応じて選択できるいくつかの種類があります。

reCAPTCHAのバージョン特徴ユーザーの操作
reCAPTCHA v2「私はロボットではありません」というチェックボックスを表示する最も一般的なタイプ。 必要に応じて画像選択などの追加認証が発生する場合があります。チェックボックスへのクリックが必要
reCAPTCHA v3ユーザーのサイト内での行動を分析し、スコアを付けてbotかどうかを判断します。 ユーザー側での操作は一切不要で、利便性を損なわずに高度なスパム対策を実現できるのが最大のメリットです。不要

この記事で紹介しているGoogleフォームやWordPressのプラグイン(Contact Form 7など)では、管理画面から簡単な設定でreCAPTCHAを導入することが可能です。 サイトの目的やユーザー層に合わせて適切なバージョンを選び、スパムのない快適なフォーム運用を目指しましょう。

5.3 プライバシーポリシーの設置は必須

お問い合わせフォームで氏名やメールアドレスなどの個人情報を取得する場合、個人情報保護法に基づき、その取り扱い方針を定めたプライバシーポリシー(個人情報保護方針)の設置が不可欠です。 プライバシーポリシーを公開し、ユーザーに利用目的を明示することは、事業者の法的義務であると同時に、ユーザーからの信頼を得るためにも極めて重要です。

プライバシーポリシーには、主に以下の項目を記載する必要があります。

  • 個人情報の利用目的(例:「お問い合わせへの回答のため」など具体的に)
  • 取得する情報の種類
  • 個人データの安全管理措置
  • 第三者提供の有無
  • 保有個人データの開示、訂正、利用停止等の手続き
  • 苦情や相談のお問い合わせ窓口

さらに、フォームの送信ボタンの近くに「プライバシーポリシーに同意する」といったチェックボックスを設置し、ユーザーが同意した上で情報を送信する仕組みを設けることが強く推奨されます。 これは、ユーザーとの不要なトラブルを避け、誠実な企業姿勢を示すことにつながります。プライバシーポリシーの具体的な作成方法については、個人情報保護委員会のウェブサイトなどを参考にすると良いでしょう。

6. まとめ

本記事では、ホームページへのお問い合わせフォーム設置方法を、初心者にも分かりやすく解説しました。HTMLの知識がなくても「Googleフォーム」を使えば無料で簡単に設置でき、WordPressサイトなら「Contact Form 7」などのプラグインを活用するのが定番です。

お問い合わせという成果を最大化するには、入力項目を必要最低限に絞ることが最も重要です。また、ユーザーに安心感を与え、スパムを防ぐために自動返信メールやreCAPTCHAの導入も必ず行いましょう。この記事を参考に、最適な方法でお問い合わせフォームを設置してみてください。

LATEST

最新記事

CONTACT

お問い合わせ

ご不明な点やご質問・ご相談などございましたらお気軽にお問い合わせください。
無料相談サービスも行っております、ぜひご活用ください。