Contact Form 7プラグインでお問い合わせフォームを設置する方法

Contact Form 7プラグインでお問い合わせフォームを設置する方法

このブログ(WordPress)にContact Form 7プラグインをインストールして、お問い合わせフォームを設置しました。

そのときの設置手順を書き留めておきます。

Contact Form 7を利用すれば15分ほど設置可能

次のようなシンプルなフォームであれば、とくに難しい設定をせずに15分ほどで設置できます。

フォーム

お問い合わせフォームの項目
  • 氏名
  • メールアドレス
  • 題名
  • メッセージ本文

受信メール

Outlookの件名やメール本文

問い合わせがあると、こんな感じのメールが届きます。

自動返信メール

Gmailのの件名やメール本文

問い合わせをしてくれた方には、こんな感じの自動返信メールを送ることができます。

Contact Form 7のインストール

WordPressにContact Form 7をインストールします。

WordPress管理画面 メニュー

メニューの「プラグイン」>「新規追加」をクリック。

WordPress管理画面 プラグイン新規追加

検索窓に「Contact Form 7」を入力。

WordPress管理画面 プラグイン新規追加

Contact Form 7の「今すぐインストール」をクリック。

WordPress管理画面 プラグイン検索結果

「有効化」をクリック。

Contact Form 7のインストールは以上です。

Contact Form 7の設定方法

フォーム・受信メール・自動返信メールの設定をします。

WordPress管理画面 メニュー

メニューの「お問い合わせ」>「新規追加」をクリック。

Contact Form 7の設定

管理用のタイトル(任意の名前)を入力します。

フォームの設定

Contact Form 7 フォームの設定

フォームタブにあらかじめ「名前」「メールアドレス」「題名」「メッセージ本文(任意)」が設定されています。

僕はメッセージ本文も必須にしたかったので変更しました。必須にする方法は、タグにアスタリスク(*)を付けるだけです。

変更前

<label> メッセージ本文(任意)
    [textarea your-message] </label>

変更後

<label> メッセージ本文
    [textarea* your-message] </label>

受信メールの設定

Contact Form 7 受信メールの設定

メールタブの送信先に受信するメールアドレスを指定します。。

それから、送信元にサイトと同じドメインのメールアドレスを指定して、追加ヘッダーに返信先「Reply-To: [your-email]」を指定するのがベストな設定です。contact form 7

送信元にサイトと違うドメインのメールアドレスを指定すると、スパムや偽装メールとして扱われることがあります。

自動返信メールの設定

Contact Form 7 メール(2)のチェックボックス

メールタブの下の方にある「メール(2)を使用」にチェックを入れいると、自動返信メールの設定ができます。

Contact Form 7 自動返信メールの設定

題名の文字列が件名になります。

僕はメッセージ本文に、「このメールはシステムからの自動送信です。」などを追記しました。

変更前

メッセージ本文:
[your-message]

-- 
このメールは [_site_title] ([_site_url]) のお問い合わせフォームから送信されました

変更後

※このメールはシステムからの自動送信です。

[your-name]様

この度はお問い合わせありがとうございます。
以下の内容でお問い合わせを受け付けました。

題名: 
[your-subject]

メッセージ本文:
[your-message]

-- 
このメールは [_site_title] ([_site_url]) のお問い合わせフォームから送信されました。

設定の保存を忘れずに

Contact Form 7 設定保存

設定が終わったら、忘れずに「保存」をクリック。

Contact Form 7 ショートっコード

保存すると、固定ページに貼り付けるショートコードが表示されます。

Contact Form 7の設定方法は以上です。

お問い合わせフォームを設置

固定ページを作成して、お問い合わせフォームを設置します。

WordPress管理画面 メニュー

メニューの「固定ページ」>「新規追加」をクリック。

固定ページの設定 ショートコードの貼り付け

先ほどのショートコードを貼り付けて、「公開」クリック。

固定ページの設定 タイトルやパーマリンク

タイトルやパーマリンク、問い合わせの説明などを入力して、「更新」をクリック。

お問い合わせフォームの設置は以上です。