Contact Form 7の使い方を徹底解説!お問い合わせフォームを簡単に設置
WordPressでWebサイトを運営している方にとって、お問い合わせフォームは必須機能の一つです。しかし、設置方法がわからず悩んでいる方も多いのではないでしょうか。
今回は、WordPressで最も人気のあるお問い合わせフォームプラグイン「Contact Form 7」の使い方を初心者向けに徹底解説します。
目次
Contact Form 7とは?
Contact Form 7は、無料で使えるWordPress向けお問い合わせフォームプラグインです。直感的な操作性と豊富な機能で、初心者から上級者まで幅広く利用されています。
Contact Form 7 公式サイト
Contact Form 7 – WordPress プラグイン
Contact Form 7の使い方
Contact Form 7をインストール
WordPressの管理画面から、「プラグイン」→「新規追加」→「キーワード」欄に「Contact Form 7」と入力して検索します。検索結果に「Contact Form 7」が表示されたら、「インストール」をクリックしてインストールします。
Contact Form 7を有効化
インストールが完了したら、「プラグイン」→「インストール済みプラグイン」画面で「Contact Form 7」にチェックを入れ、「有効化」をクリックして有効化します。
お問い合わせフォームを作成
WordPress管理画面の左メニューから「お問い合わせ」→「コンタクトフォーム」を選択します。画面右上の「新規追加」ボタンをクリックして、新しいお問い合わせフォームを作成します。
フォーム要素を設定
フォーム名、送信者名、メールアドレス、メッセージなどのフォーム要素を設定します。各要素には、ラベル、入力形式、オプションなどを設定することができます。
例: デフォルトのテンプレートは以下のようになります。
お名前 (必須)
[text* your-name]
メールアドレス (必須)
[email* your-email]
件名
[text your-subject]
メッセージ本文
[textarea your-message]
[submit "送信"]
自動送信メールを設定
送信完了後に自動送信されるメールの設定は、管理者向けとユーザー向けの2種類に分かれています。
1. 管理者宛て自動送信メール
1.1. メール(1)の設定
Contact Form 7の設定画面で、「メール」タブを選択します。「メール(1)」は、お問い合わせ内容を管理者に送信するメールの設定です。
- 送信先:
管理者に送信するメールアドレスを入力します。お問い合わせが入った際に通知を受けるメールアドレスになります。 - 送信元:
送信者名と送信元のメールアドレスを入力します。なお、送信元のドメインは、必ずサイトのドメインに属するメールアドレスを指定する必要があります。 - 題名:
メール件名を入力します。初期値は[_site_title] “[your-subject]”となっているので、「ホームページからのお問い合わせ」など分かりやすいタイトルに変更しておきましょう。 - 追加ヘッダー:
必要に応じて、追加ヘッダー情報を入力することができます。
追加ヘッダーを設定することで、メールの送信設定を細かくカスタマイズすることができます。特に、「Reply-To」や「Cc」、「Bcc」といったヘッダーを設定することで、メールのやり取りや管理を効率化することが可能です。これらの設定を適切に行うことで、Contact Form 7のメール機能を最大限に活用することができます。よく使われる追加ヘッダーの例
- Reply-To ヘッダー
- Cc(カーボンコピー)
- Bcc(ブラインドカーボンコピー)
- Custom Header(カスタムヘッダー)
受信者が返信する際に使用するメールアドレスを指定します。
設定例:
Reply-To: [your-email]メールのコピーを別のメールアドレスにも送信したい場合に使用します。
設定例:
Cc: cc@example.comメールのブラインドコピーを別のメールアドレスにも送信したい場合に使用します。このアドレスは他の受信者には見えません。
設定例:
Bcc: bcc@example.com他にも任意のカスタムヘッダーを追加することができます。
設定例:
X-Mailer: PHP/7.4 - メッセージ本文:
管理者宛てメールの本文を設定します。本文には、フォームの入力データをショートコードとして挿入できます。例えば、以下のように設定します。送信者名: [your-name] 送信者メールアドレス: [your-email] 件名: [your-subject] メッセージ本文: [your-message] 送信日時: [date]
1.2. その他の設定
- ファイルを添付する:
送信されたファイルがあれば、自動的に添付することができます。 - HTML フォーマット:
メール本文をHTML形式で送信することができます。
2. ユーザー宛てメールの設定
2.1. メール(2)の設定
Contact Form 7の設定画面で、「メール」タブを選択します。「メール(2)」は、ユーザーにお問い合わせ完了を知らせるメールの設定です。
- 送信先:
ユーザーに入力されたメールアドレスに自動的に送信されます。 - 送信元:
送信者名とメールアドレスを入力します。 - 題名:
メール件名を入力します。 - 追加ヘッダー:
必要に応じて、追加ヘッダー情報を入力することができます。 - メッセージ本文:
ユーザーへの感謝のメッセージや、今後の連絡方法などを記載します。[your-name] 様 この度は、お問い合わせいただきありがとうございます。以下の内容で受け付けました。 送信者名: [your-name] 送信者メールアドレス: [your-email] 件名: [your-subject] メッセージ本文: [your-message] 担当者から改めてご連絡いたしますので、しばらくお待ちください。 ----------------------------------------- [サイト名] [会社名] [住所] [電話番号] [ウェブサイトURL]
2.2. その他の設定
- HTML フォーマット: メール本文をHTML形式で送信することができます。
3. メール設定のポイント
- わかりやすい件名と本文: ユーザーがすぐに内容を理解できるような、わかりやすい件名と本文を作成しましょう。
- 必要な情報のみを記載: 長文にならないように、必要な情報のみを記載しましょう。
- モバイル端末にも対応させる: スマートフォンやタブレット端末でも見やすいように、メールデザインを調整しましょう。
Contact Form 7の自動送信メール設定を適切に行うことで、お問い合わせフォームの利便性と信頼性を向上させることができます。今回紹介した内容を参考に、ぜひ自分に合った設定を行ってください。
フォームを公開
設定が完了したら、「保存」ボタンをクリックしてフォームを保存します。保存後、画面にショートコードが表示されます。このショートコードを、お問い合わせフォームを設置したいページや投稿に貼り付ければ、フォームが表示されます。
まとめ
Contact Form 7は、初心者でも簡単に設置できるお問い合わせフォームプラグインです。今回紹介した内容を参考に、ぜひContact Form 7を使って、お問い合わせフォームを設置してみてください。
Groworks Inc.
ものづくりのまち燕三条にある三条ものづくり学校を拠点とし、新潟市、長岡市、燕市、柏崎市を中心に活動しているウェブサイト・ホームページ制作会社です。