ウェブサイトを訪問したユーザーからのフィードバックを受ける方法として「お問い合わせフォーム」を設置しておくのが一般的です。企業のサイトなどには必ずといってよいほど設置されています。そうはいっても、WordPress初心者であれば、導入方法がわからない人もいるかもしれません。WordPressの場合、プラグインを使えば簡単に作成できるようになっています。この記事ではお問い合わせフォームを作成するための5つのポイントを詳しく紹介していきます。
目次
お問い合わせフォームとは
WordPressで作成されたウェブサイトは、主に情報を発信するメディアなのですが、訪問したユーザーからの情報を受け取ることもできます。ユーザーが個人情報やコメント、質問などを直接入力して、サイト管理者に送信する仕組みを「お問い合わせフォーム」または「フォーム入力ページ」と呼びます。お問い合わせフォームの一般的な構成は、個人情報としての「氏名」、「メールアドレス」、「電話番号」など、さらに「お問い合わせ内容」などとなっています。末尾には、「送信ボタン」があり、それをクリックすることで送信が完了するしくみです。ここでフォームというのは、ユーザーが入力できるエリアのことです。
フォームはHTML(HyperText Markup Language)の<form>タグを使って実装します。フォームに入力された情報は、ウェブサーバに送られるのが一般的です。ただし、フォームを作っただけでは管理者がメッセージを受け取ることはできません。php(Hypertext Preprocessor)などのサーバーで使える言語で処理して初めて機能します。お問い合わせフォームを導入する際には、3つのポイントがあるといわれています。
1つ目は、見やすいことです。ウェブページの見た目はCSS(Cascading Style Sheets)で調節しますが、フォームに関しては特に注意すべき点があります。まず、フォントの大きさです。おしゃれなウェブデザインでは小さなフォントが好まれる傾向にありますが、あまり小さすぎると読みにくいので16px程度は確保しましょう。次に、入力ボックスの大きさです。height(高さ)は50px程度にしておくとよいでしょう。最後は、余白が十分に取られているかどうかです。PCの操作でマウスとポインターを使える場合は、余白はそれほど気にする必要はありません。ただし、スマートフォンの場合は指で操作するため、余白が少ないと誤タップを起こしやすくなります。
ポイントの2つ目は、使いやすいことです。デジタルデータでメッセージを送る場合、形がないので、自分が送信できたかどうか不安になるときがあります。メールソフトであれば、送信履歴を確認すればよいのですが、お問い合わせフォームの場合はその方法は使えません。そこで、送信が完了したら「サンキューページ」を表示させるようにする方法があります。サンキューページとは、「送信頂きありがとうございました」などの確認メッセージが表示されるページのことで、ユーザーは送信が無事に完了したことがわかるのです。お問い合わせフォーム用のプラグインによっては、自動返信メールを設定できるものもあります。こちらは、ページの表示ではなく、ユーザーが入力したメールアドレス宛に送信完了確認のメールが送られます。
ポイントの3つ目は、安心して使えることです。お問い合わせフォームには、ユーザーが個人情報を入力します。取扱には十分注意するとともに、個人情報についての「プライバシーポリシー」を開示するなどして、ユーザーとの信頼関係を築く努力が重要です。プライバシーポリシーとは、収集した個人情報の扱いについてサイト管理者が定めた規範のことです。個人情報保護方針とも呼ばれています。お問い合わせフォームを設置する場合は、プライバシーポリシーのページも合わせて設置したほうがよいでしょう。
お問い合わせフォームが掲載されるページにも、個人情報の保護方針について遵守する旨が書かれた文章を掲載するか、プライバシーポリシーのページへのリンクを張ります。さらに、チェックボックスに「個人情報の取扱について、同意の上で送信します」などのメッセージを付けて、チェックを入れなければ送信できないようにしておくとよいでしょう。個人情報を含むメッセージを送信するユーザーに対して、同意したという意識を持ってもらえます。
お問い合わせフォームの使用例
ユーザーからの情報を収集できるお問い合わせフォームは、主に以下のような目的で使うことができます。1つ目は「キャンペーン応募」です。企業のウェブサイトなどでキャンペーンを行う場合に、応募フォームとして使えます。一般的には、はがきや電話での応募も行われていますが、お問い合わせフォームを使えば集計も簡単に行えるので、経費を削減しながらプロモーションが可能になるでしょう。
2つ目は「お問い合わせ」です。これは、プライバシーポリシーと併せて、ウェブサイトへの設置は必須といえるでしょう。お問い合わせフォームを設置することで、サイトの双方向性が高まり、ユーザーからの信頼度の向上が見込めます。アフィリエイト広告を掲載する際に、プライバシーポリシーとお問い合わせフォームの設置を義務付けている事業者もあるようです。
3つ目は「お客様の声など様々な情報を収集するためのフォーム」です。これは、企業サイトなどで恒常的なご意見窓口の1つとして設置されるタイプです。たいていは、電話、メールアドレス、チャットと同じような扱いで、選択肢の1つとしてフォームからの入力がウェブサイトに実装されることが多くなっています。
4つ目は「仕事の依頼」などです。法律事務所や設計事務所などのサイトでよく見られます。最初のコンタクトで電話や面談に抵抗がある場合、お問い合わせフォームは有効な方法となります。まず、ユーザーからフォームで概要を伝えてもらい、それに返信を送ることから、仕事につながる可能性があります。仕事の依頼に用いる場合には、とくにプライバシーポリシーや会社概要を充実させておきましょう。ユーザーからの信頼性が高まるので、フォームからの問い合わせが増える可能性があります。
お問い合わせフォームを設置するメリット
ウェブサイトでお問い合わせフォームを設置するメリットは大きく2つあります。1つ目は、企業などから直接仕事の依頼が来ることがある点です。現実の世界と違って、インターネットでつながったサイバースペースでは、お互いの関係がよりフラットになっています。企業と個人が同等な存在感を持って直接対峙できるのです。また、世界がつながっているため、現実の世界で商圏と呼ばれている空間的な限界がありません。魅力的な商品やサービスを提供していれば、世界中の企業や個人が潜在顧客になるわけです。その依頼の受け皿としては、お問い合わせフォームは最適といえます。ウェブサイトに掲載された商品やサービスを見て、すぐに連絡がとれるからです。
2つ目は、ユーザーの意見を収集することができる点です。お問い合わせフォームを使わずに、ユーザーからの意見を収集するためには、相当なコストが掛かります。たとえば、電話で対応する場合には、自社でコールセンターを設置するか外注する必要があります。人件費や外注費もかかり、通常は対応時間も9時から19時程度に限定されてしまいます。チャットも同様です。AIではなく担当者が対応するチャットは、コールセンターと同じような限界があります。メールの場合は、お問い合わせフォームの設置と比べて、コストは同程度ですが、意見を収集する期間や最終的なメッセージの配信先をコントロールできません。たとえば、特定のプロジェクトに対しての意見を募集する場合を考えてみましょう。プロジェクト専用の期間限定のウェブサイトを立ち上げて、そこに設置したお問い合わせフォームを窓口にします。こうすると、意見の募集期間をプロジェクトの期間と連動させることが可能で、フォームから収集したデータの送付先を適宜変更することも可能になります。
お問い合わせフォームを設置する際の5つのポイント
お問い合わせフォームを設置する際には以下の5つのポイントをチェックしましょう。1つ目は、フォーム数は必要最低限にとどめることです。情報を収集する立場からすれば、なるべく多くの情報を得たいと思うでしょう。逆に、ユーザー側からすれば、面倒な文字入力は極力避けたいと思うのが一般的です。ユーザーが入力する情報は最低限に留める必要があります。とくに、「住所項目」はコンバージョン率を下げるといわれています。どうしても必要でなければ、できるだけ設置しないほうが良いでしょう。
2つ目は、スマートフォンに対応していることです。電源を入れたり、バッグから出してテーブルの上に広げたりするPCよりも、スマートフォンのほうが気軽にネットへアクセスできます。ウェブサイト自体がスマートフォンに対応しているのはもちろんのこと、お問い合わせフォームもスマートフォン対応が求められるのです。とくに、PCと比べて小さな液晶で表示が切れないように、ウェブサイトの設計段階でスマートフォン対応しておく必要があります。具体的には、スマートフォン専用のサイトを用意するか、レスポンシブデザインを採用する方法があります。
3つ目は、必須項目をわかりやすく区別しておくことです。お問い合わせフォームに入力してもらう項目には、名前やメールアドレスなど入力必須項目があります。このような入力フォームには「※必須項目」などと明記しておきましょう。また、必須項目を入力せずに送信ボタンを押しても送れないような設定にする方法もあります。
4つ目は、エラーメッセージをわかりやすく表示することです。エラーが出たフォームの色を変えたり、どのような間違いがあるのかについてメッセージで表示すると、ユーザーにとってわかりやすいものになります。5つ目は、モバイル・フレンドリーを心がけることです。モバイル端末ユーザーにとって使いやすい環境を目指す取り組みを「モバイル・フレンドリー」といいます。お問い合わせフォームのデザインでいえば、以下の点に注意する必要があります。Flashを使わないこと、HTMLのタグのname属性にviewportを設定しておくこと、縦スクロールだけで閲覧可能なことなどです。なお、googleが提供するチェックツール「モバイル・フレンドリーテスト」のサイトにURLを入れると、そのサイトのモバイル対応に関する評価がわかります。
【おすすめプラグイン】1.Ninja Forms
お問い合わせフォームを導入する際におすすめのプラグインがNinja Formsです。操作が直感的にできる点で高く評価されています。Ninja Formsでは、お問い合わせフォームだけではなく、メール登録フォーム、注文フォーム、支払いフォームなどが作成できます。Ninja Formsの導入手順としては、まずインストールして有効化しす。管理画面の左コラムに「Ninja Forms」が表示されていれば、有効化は成功です。そのNinja Formsをクリックして、プルダウンメニューから新規追加を選びましょう。表示された17のテンプレートからどのようなフォームを作成するか選びます。
空のフォーム、お問い合わせ、見積リクエストなど種類が充実しており、決済サービスStripeと連携した支払いフォームのテンプレートまで用意されているのです。テンプレートを選ぶと、編集画面に移ります。画面右側にはユーザーに入力してもらうフォームを挿入するウィジェットが並んでいるので、それを左の画面にドラッグ&ドロップしてフォームを作成します。Ninja Formsでは、様々なウィジェットが選べるのも魅力です。たとえば、「スター評価」では、星の数で評価するパラメータを設定できます。Ninja Formsは、かゆいところに手が届くお問い合わせフォームプラグインといえます。
【おすすめプラグイン】2.ContactForm7
WordPressのお問い合わせフォームの定番といってよいプラグインがContactForm7です。多くのWordPressユーザーが使用しているため、ネット上での関連情報が豊富な点はWordPress初心者にとって魅力があります。ContactForm7では、お問い合わせフォームのほか、アンケートフォームや採用応募フォームの作成が可能です。導入手順は、まずインストールして有効化します。管理画面の左コラムに「お問い合わせ」の表示があることを確認して、そこにマウスオーバーするとプルダウンメニューが表示されます。メニューの中から「新規追加」を選ぶと、編集画面が開きます。
お問い合わせフォームのスパム対策
お問い合わせフォームを設置する際に問題になるのがスパムメールです。スパム対策に有効な方法として、プラグイン側で実装可能な「reCAPTCHA」があります。具体的には、Googleのサイトで表示される「私はロボットではありません」ボタンを設置するのです。導入方法は、まずGoogleからAPI Keyを発行してもらいます。reCAPTCHAのサイトに行き、必要な情報を入力し、プライバシーポリシーに同意すると登録できます。登録すると、同時にKeyが発行されるのです。発行された「Site key」と「Secret key」を書き留めたら、次はプラグイン側の設定を行います。
プラグインがContactForm7の場合、「お問い合わせ」から「インテグレーション」を開き、書き留めた2つのkeyを入力して保存しましょう。「設定を保存しました。」の表示を確認したら、お問い合わせフォーム上に「私はロボットではありません」ボタンを設置します。「お問い合わせ」から「コンタクトフォーム」を開き、既に作成してあるフォームを選びましょう。「フォーム」タブの上の方に表示されている「reCAPTCHA」ボタンを押して、設定を確認し、「タグを挿入」ボタンを押します。
「フォーム」の編集画面でreCAPTCHAのショートコードが挿入されていることを確認して「保存」をクリックします。いったんサイトを表示してみて「私はロボットではありません」ボタンの位置を確認しましょう。もし調整が必要であれば「フォーム」の画面に戻って、ショートコードの位置をずらしたり、改行してたりして調節することになります。
まとめ
ウェブサイトに双方向性を持たせるには、お問い合わせフォームの設置がおすすめです。サイトに掲載された情報を一方的に発信するだけではなく、ユーザーのニーズやコメントが得られ、商品やサービスの改善に活かすことができます。
あすゆで says
始めまして。質問宜しいでしょうか?
パソコン初心者です。
WordPressでninnjya forms をいれました。お問い合わせフォームをつくり、テストをしてみましたが、
自分へのメールが返ってきません。
自動返信メールは届きます。
色々調べましたが、知識がなく困っております。
原因教えて頂けますでしょうか?
大塚 悟司 says
あすゆでさん
コメントいただきまして、誠にありがとうございます!
実際にサイトの状況を見ていないので的確なアドバイスはできないかもしれませんが、
Ninja Forms のメールアクションで、管理者宛のメールアドレスに送信されるメールは追加されましたでしょうか?
Ninja Forms は「メール」のアクションで
① 自動返信メール と
② 管理者宛のメール を
設定する形になりますので、
メールアクションがそれぞれで合計2つ設定されている形になれば
正しく設定されていると思いますが、現状どうなっていますでしょうか?
あすゆで says
回答ありがとうございます。
管理者宛のメールは、メールが届くアドレスを入れなければならないと思いますが、
そのアドレスが、どのアドレスを入れれば良いのかわかりません。
かなり初歩的ですが、宜しくお願いいたします。
大塚 悟司 says
あすゆでさん
お返事ありがとうございます!
メールアドレスを Ninja Forms でどこに設定するかという点ですが、
文章だけでは少し難しいため、下記の設定画面のスクリーンショットをご覧いただければと思います:
https://gyazo.com/06a0e7cdf9689150333d3394d911c5ca
Ninja Forms のフォーム作成画面で「メールとアクション」のタブ(?)を開いていただき、
そこからメール送信のアクションから設定していただきます。
歯車マークでアクションの設定を開き、「宛先」の項目に、メールアドレスを入力し、保存すれば完了です。
※ 上記画像では数字の順番にクリックしていただければ該当の場所を開けると思います。
この際、メールアドレスを直接入力していただいても結構ですが、
上記画像では、Ninja Forms 特有の変数「{wp:admin_email}」を利用した形となっておりますので、
ご確認ください。
あすゆで says
度々回答ありがとうございます。
おかげさまで、解決出来ました。
管理者宛のメール欄には、携帯のアドレスを入れましたが、携帯には管理者宛のメールは届かなかったので、
PC用のメールアドレスを入れましたら、メールが届きました。
どうやら、携帯電話のメールは、はじかれていたようです。
ご丁寧に回答頂き、ありがとうございました。
大塚 悟司 says
メールがしっかり届いたようで、良かったです!
確かに携帯のキャリア宛のメールは、各社厳しく設定されていると聞いております。
また何かご質問等ございましたらお気軽にコメントいただけたら幸いです!