WordPressでお問合せフォームが作れるプラグイン

フォームの表示内容の変更

さてここまでがほぼデフォルトのままでのフォームの作成手順です。次にこのフォームの表示内容を変更の仕方を説明します。

WordPress管理画面より[お問合せ]->[コンタクトフォーム]を選択してコンタクトフォーム一覧を表示させてください。お問合せ01の文字の下にマウスカーソルを持って行くと編集というリンク文字が表示されますのでクリックするとお問合せ01の編集画面が表示されます。

ここで例として以下3項目の編集をします。

  • 題名の項を消す
  • 会社名の入力欄を必須として追加する。
  • 電話番号の入力欄を追加する。

フォームタブのテキストエディタ部のコードはデフォルトで以下のようになっています。

<label> お名前 (必須)
    [text* your-name] </label>

<label> メールアドレス (必須)
    [email* your-email] </label>

<label> 題名
    [text your-subject] </label>

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

[submit "送信"]

まず、題名の項目を削除します。これはこのテキストエディタ上で以下のところを削除してください。削除するとこうなります。

<label> お名前 (必須)
    [text* your-name] </label>

<label> メールアドレス (必須)
    [email* your-email] </label>

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

[submit "送信"]

次に会社名の入力欄を必須として追加します。会社名は、お問合せフォームの最上部に配置します。配置したい行を改行して開けてカーソルを一番上に置いておいてください。

その状態でテキストエディタの上部の中からテキストをクリックしてください。

クリックすると以下のようなウィンドウが表示されます。

項目タイプの必須項目前のチェックボックスにチェックを入れてください。

名前の項目をyour-companyと書き換えてください。

一番下の[タグを挿入]をクリックしてください。ウィンドウが閉じてテキストエディタの1行目に[text* your-company]が挿入されますのでこのタグを囲うように<label>会社名(必須) [text* your-company] </label>と手描きしてください。

<label> 会社名 (必須)
    [text* your-company] </label>

<label> お名前 (必須)
    [text* your-name] </label>

<label> メールアドレス (必須)
    [email* your-email] </label>

<label> 題名
    [text your-subject] </label>

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

[submit "送信"]

[text * xxxxxx]の*は必須であることを示します。*を削除すると必須ではなくなります。

次に電話番号の項目を追加します。電話番号は名前の後がいいですね。会社名のときと同じようにお名前の<label>…</label>の下に2行空けます。

今度はテキストエディタ上側の[電話番号]をクリックします。そして名前のところをyour-telnoと書き換えます。必須項目にチェックは入れません。そして[タグを挿入]をクリックします。

<label> 会社名 (必須)
    [text* your-company] </label>

<label> お名前 (必須)
    [text* your-name] </label>

[tel your-telno]

<label> メールアドレス (必須)
    [email* your-email] </label>

<label> 題名
    [text your-subject] </label>

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

[submit "送信"]

<label> …</label>を追記します。

<label> 会社名 (必須)
    [text* your-company] </label>

<label> お名前 (必須)
    [text* your-name] </label>

<label> お電話番号
    [tel your-telno] </label>

<label> メールアドレス (必須)
    [email* your-email] </label>

<label> 題名
    [text your-subject] </label>

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

[submit "送信"]

送信メール内容の変更

次に変更したフォームの項目を送信メールの内容に反映させます。

先ほどフォームタブで題名を消して会社名と電話番号を追加しました。対応したタグ名は以下の通りです。

  • 題名 = [your-subject]
  • 会社名 = [your-company]
  • 電話番号 = [your-telno]

なのでメールタブ内の題名の項目から“[your-subject]”を削除します。メッセージ本文の項から題名: [your-subject]の1行を削除します。

次にメッセージ本文に会社名:[your-company]電話番号:[your-telno]を追記します。とこんな感じになります。

次にスパム対応として送信した人のIPアドレスを送信メールに追記する方法です。Contact Form7 には、特別なメールタグが使えるとのことです。これはContact Form 7の使い方サイトに記載されています。

参考URL : Contact Form 7 特別なメールタグ

[_remote_ip]というタグをメール本文に入れることで送信した人のIPドレスをメールに追記して送ることができます。今回電話番号の下に書いてみました。ただし使われるサイトの

お問合せフォームに入力した人に送信確認メールを送る設定をする。

送信確認メール送るには、このメールタブの一番下のメール(2)のメール(2)を使用にチェックを入れてください。上と同じような感じでメール(2)の送信項目が表示されます。送信先はデフォルトでお問合せフォームに記入されたメールアドレスが置換されるように[your-email]が入力されています。

なので後はお問合せボタンを押した人に確認メールとして送りたい内容に編集すればOKです。

メール(2)のデフォルト入力内容。これを好みに編集する。

最後にページ右上もしくは、ページ左下の[保存]ボタンを押したら完了です。編集した内容が反映されているのがわかります。

固定ページのContact Usをプレビューしてみましょう。

Contact Form 7は秀逸なプラグインの1つですね。まだまだ機能があるようですので詳しい内容はContact Form 7製作者さんの使い方サイトを参照していってください。

この投稿へのコメント

コメントはありません。

コメントを残す

メールアドレスが公開されることはありません。

この投稿へのトラックバック

トラックバックはありません。

トラックバック URL