士業サイトには、サービスに関心を持った人が連絡しやすいように、お問い合わせ窓口のフォームがほしいですよね。
WordPressを使って士業サイトを運営していく場合、難しい知識がなくても、適切なプラグインを選ぶことで、お問い合わせフォームを簡単に設置できます。
ここでは、士業サイトにお問い合わせフォームを作る方法について、WordPressのプラグインを使ってご説明してきます。
お問い合わせページの作成
士業サイトには、お問い合わせページはなくてはならないものです。
メールや電話で問い合わせる方法もありますが、ホームページに訪れた人が気軽に連絡しやすい窓口として「お問い合わせ」ページはあった方が親切です。
どのようなページができるかは、WordPressのビジネス向けテーマ「Lightning」のデモサイトが参考になります。
WordPressの設定
まず、WordPressでウェブページを作成するには、事前準備と設定が必要です。WordPressの初期設定ができてから、「お問い合わせ」のページ作成に進んでください。
事前準備
- ドメインの取得
事務所名やサービスに合ったドメイン - レンタルサーバーの契約
信頼性の高いレンタルサーバー - WordPressのインストール
サーバーの管理画面から簡単にセットアップ可能 - SSL設定
セキュリティ向上のため必要
WordPressの事前準備については、こちらの記事で詳しくご紹介します。
WordPressの入門書
WorePressを初めて操作する人は、入門書などを確認しながら自社サイト用に、カスタマイズするとスムーズに進められると思います。
お問い合わせフォームのプラグイン
お問い合せフォームは、WordPressのプラグインを使えば、初心者でも簡単に作ることができます。
ビジネスのウェブサイトに設置するフォームとして、必要な機能のあるプラグインを選ぶことで、業務効率の向上や、スムーズな顧客対応が可能になります。
プラグインの選び方
お問い合わせフォームのプラグインを選ぶときには、次のようなポイントを考慮して、ビジネスの目的に合ったものを選びましょう。
- 費用
無料か有料か。 - カスタマイズ性
必要な項目を自由に追加・削除できるか。 - スパム対策
スパムメールが増えないような機能があるか。 - データ保存機能
問い合わせ履歴を管理できるか。 - ユーザーの使いやすさ
入力しやすいデザインになっているか。 - レスポンシブ対応
スマートフォンやタブレットでも問題なく動作するか。
Contact Form 7
「Contact Form7」は、お問い合わせフォームとして多くの人が利用するWordPressのプラグインです。私も社労士事務所のウェブサイトでは、お問い合わせページにこのブラグインを使いました。
他にも有料のものなど、より高機能なプラグインはありますが、「お問合せを受け付ける」という基本的な機能で、このプラグインよりおすすめできるものを見つけられませんでした。
特徴
- 無料で利用できる
- シンプルで軽量
- ショートコードを利用して簡単にフォームを設置できる
- スパム対策機能が充実
おすすめポイント
- 多くのWordPressユーザーに支持されていて、情報が豊富
- カスタマイズ性が高い
Contact Form7をインストールする
「Contact Form7」は、WordPressの管理画面からインストールして設定します。
プラグインの追加
WordPressの管理画面にログインして、左側メニュー「プラグイン」→「新規追加」をクリックします。
プラグインの検索ボックスに「Contact Form 7」と入力して、「今すぐインストール」をクリックします。
インストールが完了したら、「有効化」をクリックします。
フォームの作成
「Contact Form 7」をインストールすると、管理画面の左側メニューに「お問い合わせ」という項目が追加されます。
「お問い合わせ」→「コンタクトフォーム」をクリックして、タイトルに「お問い合わせフォーム」と入力します。
デフォルトのフォームが用意されていますが、目的に合わせてカスタマイズします。シンプルにお問い合わせを受けるだけであれば、次のように設定します。
- 見本フォームの削除
「フォーム」タブで見本のフォームを削除します。 - 名前の項目追加
編集画面で「お名前」と入力、改行して「テキスト」をクリックします。 - 名前のフォーム設定
フォームの設定画面が表示されたら、「名前」を「name」に書き換えて、「タグを挿入」をクリックします。 - メールアドレスの項目追加
お名前タグの下を1行空けて「メールアドレス」と入力、改行して「メールアドレス」をクリックします。 - メールアドレスのフォーム設定
フォームの設定画面で、「名前」を「email」に書き換えて、「タグを挿入」をクリックします。 - お問い合わせ内容の項目追加
メールアドレスのタグの下を１行空けて「お問い合わせ内容」と入力、改行して「テキストエリア」をクリックします。 - お問い合わせ内容のフォーム設定
フォームの設定画面で、「名前」を「message」に書き換えて、「タグを挿入」をクリックします。 - 送信ボタンの追加
お問い合わせ内容タグの下を１行空けて「送信ボタン」をクリックします。 - 送信ボタンの設定
フォームの設定画面で、「ラベル」に「送信する」と入力、「タグを挿入」をクリックします。 - メールの設定
「メール」タブで「送信先」にフォームの内容が送信されるメールアドレスを入力します。 - フォームの設定を保存
「保存」をクリックして、ショートコードを取得します。
お問い合わせページを作成する
お問い合わせフォームを作成しただけでは、確認できませんので、表示させるためのページを作成します。お問い合わせページは固定ページで編集します。
固定ページを追加する
「固定ページ」→「新規追加」をクリックして、タイトルに「お問い合わせ」と入力します。
「段落」ブロックで、お問い合わせについての内容を入力します。
フォームを設置
お問い合わせについての内容の下に「ショートコード」ブロックを追加します。
「Contact Form 7」でフォームを作成すると、ショートコード（[contact-form-7 id=”○○○”]）が表示されますので、このショートコードをコピーして、「ショートコード」ブロックに貼り付けます。
フォームを公開
画面右にある「固定ページ」タブから「URL」をクリックして、「パーマリンク」を「contact」などに書き換えて「公開」をクリックします。
フォームの動作確認
フォームを設置した「お問い合わせページ」を開いて、実際にお問い合わせを送信してみます。
送信して、メールが届いていることを確認できたら完成です。
Googleフォーム
ビジネス用のお問合せフォームとしては、あまりふさわしいとは思いませんが、プラグインが決まらない、使わない、という人は、お問い合わせフォームを「Googleフォーム」で作ることもできます。
Googleフォームは、Googleが提供する無料のフォーム作成ツールです。アンケートや申請フォームなど、さまざまな用途に使われています。
このサイトでは、コンタクトページに設置しています。ビジネス用としては、あまりふさわしくはないかもしれませんが、機能としては問題なく使えますので、ご紹介します。
お問い合わせフォームとして利用する場合には、次のようなメリットがあります
メリット
- 無料で利用可能
- 直感的な操作で簡単に作成できる
- メール通知機能を設定できる
- 埋め込み機能を利用してウェブサイトに設置できる
Googleフォームの作成方法
Googleフォームの作成ページにアクセスして、画面右下の「＋」ボタンをクリックして新しいフォームを作成します。
フォームの基本情報を設定する
「無題のフォーム」と書かれている部分をクリックし、「お問い合わせフォーム」などの適切なタイトルを入力します。
「フォームの説明」に、お問い合わせの目的や注意事項を記載します。
質問を追加する
フォームには、次のような項目を追加することができます。各質問を追加するには、「＋」ボタンをクリックし、それぞれの質問を設定します。
- 名前（必須）
記述式：短い回答 - メールアドレス（必須）
記述式：メール形式を設定 - お問い合わせ内容（必須）
記述式：段落 - 返信方法の希望（任意）
選択式：「メール」「電話」「どちらでも可」など
入力制限や必須項目の設定
フォームの精度を上げるために、入力制限や必須項目の設定を行うことができます。
- メールアドレス欄には、「回答の検証」オプションを利用して「メールアドレスの形式」に制限をかける。
- 必須項目には「必須」にチェックを入れることで、未入力での送信を防ぐ。
フォームのデザインを整える
Googleフォームでは、デザインをカスタマイズできます。
画面上部の「カラーパレット」アイコンをクリックして、テーマカラーや背景色を変更できます。
「画像を選択」からは、ヘッダー画像を設定できます。
回答の収集方法を設定する
お問い合わせフォームからの回答をスムーズに管理するため、回答の収集方法を設定しましょう。
「回答」タブを開き、「スプレッドシートのアイコン」をクリックして、新しいスプレッドシートに回答を保存します。
「設定」タブから「メール通知を受け取る」設定をオンにすると、新しい回答が届いたときにメールで通知を受け取ることができます。
フォームをサイトに埋め込む方法
WordPressの場合は、「カスタムHTML」ブロックを追加して、取得したコードを貼り付けることで簡単に埋め込めます。フォームが完成したら、公開して利用できるようにします。
- 「送信」ボタンをクリックします。
- 「埋め込む」タブを選択します。
- 「HTMLをコピー」ボタンをクリックします。
- 取得したコードをウェブサイトのHTMLに貼り付けます。
まとめ
お問い合わせページを自分で作るのは難しいですが、プラグインやGoogleフォームを使えば、簡単に作成できます。ビジネスのウェブサイトに合ったお問い合わせページを作成する参考になれば幸いです。
事務所サイトの効率的な作成順序
①事務所概要ページ
（基本情報の記載のみで作成しやすい）
②お問い合わせページ
（プラグインを活用すれば短時間で作成可能）
③サービス案内ページ
（情報の整理が必要だが、内容が決まればスムーズ）
④トップページ
（他のページをもとにデザインし、全体の統一感を持たせる）
⑤ブログ記事
（必須コンテンツができたら、投稿で情報発信をしていく）
WordPressのWebページ作成については、こちらの記事で詳しくご紹介します。
