入力に不備がある場合のメッセージは特に「何が間違っているのか」をユーザーに伝えるために非常に重要です。初期設定のままでも問題はありませんが、一度全体を確認して自分のサイトにあった文体に直すとより良いでしょう！
参考 Contact Form 7インストールしてないや…という方は、こちらの記事をご覧ください。
参考 今回の「メッセージ」タブでの操作は「フォーム」タブと「メール」タブの設定に基づいています。これらのタブの設定がまだの方は、まずは次の記事で「フォーム」タブと「メール」タブの設定を終えてからこちらに戻ってきましょう。
- 「フォーム」タブの設定：[Contact Form 7]お問い合わせフォームに好きな項目を追加しよう
- 「メール」タブの設定：[Contact Form 7]受信したお問い合わせに自動返信しよう
Contact Form 7の管理画面
まずはWordPressにログインし、左のサイドメニュー「 お問い合わせ」から「コンタクトフォーム」を開きましょう。
初めてこの画面を開いた場合、「コンタクトフォーム1」というフォームが１つ用意されているのでクリックしましょう。
「新規追加」をクリックすれば「コンタクトフォーム1」とまったく同じものが作られるのでご安心ください。
［Contact Form 7］お問い合わせフォームを設置しようの記事から来た方や、すでに自分でお問い合わせフォームを作っているという方は、そちらを開きましょう。
フォームの編集画面は次のようになっています。
フォームの名前を変更
どこかに表示されるわけではないので「コンタクトフォーム1」という名前のままでも問題はありませんが、気になる方はわかりやすいように「お問い合わせフォーム」などに名前を変更しておきましょう。
４つのタブ
Contact Form 7では、「フォーム」、「メール」、「メッセージ」、「その他の設定」の４つのタブでそれぞれ異なる設定をしていきます。
各タブで設定できることは、以下の通りです。
- フォーム：ユーザー名、メールアドレスなどユーザーがフォームに入力する情報の設定
- メール：フォームが届いたときに自動送信するメールの設定
- メッセージ：フォームの入力不備や送信完了をユーザーに伝えるためのメッセージ設定
- その他の設定：様々なカスタマイズのためのコードの設定（中級者向け）
今回扱うのは、「メッセージ」タブの操作です。
「メッセージ」タブ
メッセージタブでは、ユーザーがお問い合せフォームを送信する際の
- 入力に問題があると伝えるエラーメッセージ
- 送信が正常に完了したかどうかを伝えるメッセージ
を設定することができます。
これらのメッセージは大きく
- 送信ボタンの下に表示されるメッセージ
- 各項目の下に表示されるメッセージ
の２つに分けることができます。1つずつ見ていきましょう。
ちなみに、すべてのメッセージでメールタグを使用することができます。
送信ボタンの下に表示されるメッセージ
- メッセージが正常に送信された
- メッセージの送信に失敗した
- 入力内容に不備が見つかった
- 送信がスパムとみなされた
- 承諾が必要な項目が承諾されていない
上の５つのメッセージは、ユーザーが送信ボタンをクリックしたあと次のように送信ボタンの下に表示されます。
ありがとうございます。メッセージは送信されました。
メッセージが正常に送信された
お問い合わせフォームが問題なく送信されたときに表示されるメッセージです。初期状態では次のようになっています。
ありがとうございます。メッセージは送信されました。
このままでも問題ありませんが、
お問い合わせありがとうございます。お問い合わせ内容を確認の上、管理人よりご連絡差し上げます。
などとするとより丁寧でしょう。もしくはメールタグを使用して
[your-name]様、この度はお問い合わせありがとうございます。お問い合わせ内容を確認の上、管理人よりご連絡差し上げます。
のようにしてもいいかもしれません。
ユーザーに自動返信メールを送っている場合は、
メッセージは正常に送信されました。自動返信メールをお送りしましたので、ご確認ください。
などもいいでしょう。
メッセージの送信に失敗した
みなさんが使用しているメールサーバーに問題が発生してお問い合わせフォームが送信できなかったときに表示されるメッセージです。初期状態では次のようになっています。
メッセージの送信に失敗しました。後でまたお試しください。
メールを送受信する役割を持つコンピュータです。実はメールのやりとりをする際に私たちは、「メールサーバーさん、このメールを送って」とメールサーバーにお願いをしていて、裏でメールサーバーが仕事をしてくれているのです。ほとんどの場合WordPressをインストールした「エックスサーバー」や「ロリポップ！」などのWebサーバーがメールサーバーの役割を担っているため、この違いを意識する必要はあまりありません。
こちらは主にサイトの運営側の問題であってユーザー側のミスではありません。
エラーの原因を説明してもユーザーにはどうすることもできないため、詳しい説明をする必要はありませんが、「自分の入力に問題がある」と誤解させてしまわないようにする工夫は必要です。
次のようにすると「自分の入力に問題があるのではなくサイト側の問題で送れていないだけ」とユーザーに理解してもらえるためおすすめです。
現在一時的にお問い合わせを受け付けることができない状態になっています。時間を置いて再度お試しください。
入力内容に不備が見つかった
ユーザーの入力内容に不備がありお問い合わせフォームが送信できなかったときに表示されるメッセージです。初期状態では次のようになっています。
入力内容に問題があります。確認して再度お試しください。
どこの入力内容が間違っているのかはまた別のメッセージが表示してくれるため、ここは特に変更する必要はないでしょう。
もちろん言い回しなどは変えてOKです！
送信がスパムと見なされた
ユーザー名やメールアドレスからお問い合わせがスパム（迷惑行為）であると判断されてフォームが送信できなかったときに表示されるメッセージです。初期状態では次のようになっています。
メッセージの送信に失敗しました。後でまたお試しください。
迷惑行為をしてくる相手に対して「あなたは迷惑なのでお問い合わせを受け付けません」と伝えたところで、ユーザー名やメールアドレスを変えて突破しようとしてくるだけなので、スパムであると伝えるだけ無駄です。
それよりは原因を告げずに「失敗しました」とだけ伝える方が効果的でしょう。
そのため、基本的にはこのままで変更する必要はありません。
承諾が必要な項目が承諾されていない
承諾確認を行うタグを設置したお問い合わせフォームで、ユーザーが承認欄にチェックを入れなかった場合に表示されるメッセージです。
承認確認なんて設置してない！という方はスキップして大丈夫です。
初期状態では次のようになっています。
メッセージを送信する前に承諾確認が必要です。
このメッセージは設置した「承諾確認」の内容に合わせて変えましょう。
例えば、
のような「承諾確認」を設置している場合のメッセージは
お問い合わせの送信には規約への同意が必要です。
のようにしましょう。
各項目の下に表示されるメッセージ
- 入力必須の項目が入力されていない
- ユーザー入力が最大許容文字数を超える項目がある
- ユーザー入力が最小許容文字数に満たない項目がある
- ファイルのアップロードが何らかの理由により失敗している
- アップロードされたファイルが許可されたファイル形式に適合しない
- アップロードされたファイルが大きすぎる
- ファイルのアップロードが PHP のエラーにより失敗している
- 入力された日付の形式が正しくない
- 日付が最小制約日より小さい
- 日付が最大制約日より大きい
- 入力された数値の形式が正しくない
- 数値が最小制約値より小さい
- 数値が最大制約値より大きい
- クイズに対する正しい答えが入力されなかった
- 入力されたメールアドレスの形式が正しくない
- 入力された URL の形式が正しくない
- 入力された電話番号の形式が正しくない
上の１７個のメッセージは、入力不備がある状態でユーザーが送信ボタンをクリックしたあと次のように問題のある入力欄の下に表示されます。
入力されたメールアドレスに間違いがあります。
入力必須の項目が入力されていない
必須項目にユーザーが入力をしなかったときに、その入力欄の下に表示されるメッセージです。初期状態では次のようになっています。
必須項目に入力してください。
初期状態のままでも十分意味が通じるため、そのままで問題ないでしょう。
ちなみにとみーは「入力してください」が冗長に感じたので、シンプルに次のようにしています。
必須項目です。
テキスト入力に関するエラーメッセージ
- ユーザー入力が最大許容文字数を超える項目がある
- ユーザー入力が最小許容文字数に満たない項目がある
文字数制限をかけている入力欄でユーザーがその制限を満たさなかったときに、その入力欄の下に表示されるメッセージです。
テキスト、テキストエリア、メールアドレス、URL、電話番号、クイズの入力欄には、実は文字数制限をかけることができます。
- 入力できる最小の文字数 → minlength:文字数
- 入力できる最大の文字数 → maxlength:文字数
として、フォームタグ中のタグ名のすぐ右（3番目）に加えれば制限が有効になります。例えば、通常のテキスト欄のタグは
[text your-text] タグ名
といった感じですが、これを
[text your-text minlength:5 maxlength:10]
のようにすると、入力が5文字より少ないか10文字より多い場合にエラーを出してくれるようになります。ただし、
[text* your-text "テキストを入力" minlength: 5 maxlength:10]
のようにタグ名の右に余計なものが入るとうまく機能しないので注意しましょう。
もちろんminlengthとmaxlengthのうち片方だけ指定することも可能です。
[email* your-email maxlength:30 "example@email.com"]
初期状態では次のようになっています。
- ユーザー入力が最大許容文字数を超える項目がある：入力されたテキストが長すぎます。
- ユーザー入力が最小許容文字数に満たない項目がある：入力されたテキストが短すぎます。
こちらも特に変える点が見当たりませんが、上限・下限が何文字なのかを示してあげると丁寧です。例えば、テキストのフォームタグが
[text* my-text minlength:5 maxlength:10]
なら、
- ユーザー入力が最大許容文字数を超える項目がある：
入力は10文字以下です。
- ユーザー入力が最小許容文字数に満たない項目がある：
入力は5文字以上です。
のようにしてもいいかもしれません。
アップロードファイルに関するエラーメッセージ
ファイルのアップロードを行うタグを設置したお問い合わせフォームで、ユーザーがアップロードしたファイルに問題がある場合に表示されるメッセージです。
ファイルのアップロードなんてしないよーという方はスキップしましょう。
ファイルのアップロードが何らかの理由により失敗している
これは、はっきりした原因はわからないけどアップロードに失敗したというときに表示されるメッセージです。初期状態では次のようになっています。
ファイルのアップロード時に不明なエラーが発生しました。
エラーの原因はユーザー側かもしれませんし、Webサイト側かもしれません。
これ以上の詳細な情報はユーザーに提供できないため、初期メッセージのままでいいでしょう。
アップロードされたファイルが許可されたファイル形式に適合しない
これは、ユーザーがアップロードしたファイルの形式が求めているものと異なるときに表示されるメッセージです。初期状態では次のようになっています。
この形式のファイルはアップロードできません。
このままでも構いませんが、どんな形式を求めているのかをメッセージに含めてあげるとより親切です。例えば、ファイルのフォームタグが
[file my-file filetypes:png|jpg]
なら
PNGまたはJPG形式のファイルをアップロードしてください。
といった感じでしょうか。
アップロードされたファイルが大きすぎる
これは、ユーザーがアップロードしたファイルのサイズが設定された上限を超えているときに表示されるメッセージです。初期状態では次のようになっています。
ファイルが大きすぎます。
形式のときと同様に、サイズの上限をメッセージに含めてあげるとより親切です。例えば、ファイルのフォームタグが
[file my-file limit:10mb]
なら
サイズの上限は10MBです。
といった感じです。
ファイルのアップロードがPHPのエラーにより失敗している
これは、主にWebサイト側の設定に不備がありアップロードができなかったときに表示されるメッセージです。
アップロードできるサイズの上限は、フォームタグ（[file your-file]のようなタグ）を生成するときに決めることができるのですが、実はこれとは別にWebサーバーが設定しているアップロードのサイズの上限というものがあります。ここでのPHPのエラーというのは、Contact Form 7で指定したサイズの上限がWebサーバー側が対応できる上限を超えてしまった場合に起こることがあるようです。本当は100MBしかWebサーバーにアップロードできないのに、Contact Form 7で200MBアップロードさせるような設定になっている場合です。
この問題はWebサーバー側の上限をサイズ変更して解決できますが、そのためには複雑な操作が必要なので、初心者の方はContact Form 7で上限サイズを小さくしたフォームタグを作って現在のフォームタグを置き換えましょう。
初期状態では次のようになっています。
ファイルのアップロード中にエラーが発生しました。
「自分のファイルに問題がある」とユーザーに誤解させてしまわないように、メッセージは少し変更した方がいいかもしれません。
次のようにすると「サイト側でアップロードに関する問題があるのだ」とユーザーに理解してもらえるるようになります。
現在一時的にファイルのアップロードを受け付けることができない状態になっています。時間を置いて再度お試しください。
日付選択に関するエラーメッセージ
日付選択を行うタグを設置したお問い合わせフォームで、ユーザーが選択した日付に問題がある場合に表示されるメッセージです。
日付選択欄を設置した人だけが関係します。
入力された日付の形式が正しくない
これは、ユーザーが存在しない日付などを入力ときに表示されるメッセージです。初期状態では次のようになっています。
日付の形式が正しくありません。
特に変更の必要はないでしょう。
日付が最小制約日より小さい・日付が最大制約日より大きい
範囲を制限した日付選択欄でユーザーが範囲外の日付を選択したときに表示されるメッセージです。初期状態では次のようになっています。
- 日付が最小制約日より小さい：選択された日付は早すぎます。
- 日付が最大制約日より大きい：選択された日付は遅すぎます。
特に変えなくてもいいですが、日付の選択可能範囲を示してあげると丁寧です。例えば、日付のフォームタグが
[date* my-date min:2000-01-01 max:2022-03-04]
なら、
- 日付が最小制約日より小さい：
2000年1月1日以降を選択してください。
- 日付が最大制約日より大きい：
2022年3月4日以前を選択してください。
という具合です。
数値選択に関するエラーメッセージ
数値入力を行うタグを設置したお問い合わせフォームで、ユーザーが入力した数値に問題がある場合に表示されるメッセージです。
数値入力欄を設置した人だけが関係します。
入力された数値の形式が正しくない
これは、ユーザーが数値以外の文字を入力したときなどに表示されるメッセージです。初期状態では次のようになっています。
数値の形式に間違いがあります。
特に変更の必要はないでしょう。
数値が最小制約値より小さい・数値が最大制約値より大きい
範囲を制限した数値入力欄でユーザーが範囲外の数値を選択したときに表示されるメッセージです。初期状態では次のようになっています。
- 数値が最小制約値より小さい：入力された数値が小さすぎます。
- 数値が最大制約値より大きい：数値が最大許容値を超えています。
日付などと同様に数値の選択可能範囲を示してあげると丁寧です。例えば、数値のフォームタグが
[number* my-number min:1 max:5]
なら、
- 数値が最小制約値より小さい：
1以上を選択してください。
- 数値が最大制約値より大きい：
5以下を選択してください。
ですね。また、わざわざ範囲をメッセージに含めない場合でも、「最大許容値を超えている」という表現がしっくりこない場合は
入力された数値が大きすぎます。
などと調整しましょう。
クイズに対する正しい答えが入力されなかった
クイズのタグを設置したお問い合わせフォームで、ユーザーがクイズに正解できなかった場合に表示されるメッセージです。
クイズを設置した人だけ対象です。
初期状態では次のようになっています。
クイズの答えが正しくありません。
言い回しが気になる方はカスタマイズしても構いませんが、基本的にはそのままでいいでしょう。
メールアドレス・URL・電話番号の形式に関するエラーメッセージ
- 入力されたメールアドレスの形式が正しくない
- 入力された URL の形式が正しくない
- 入力された電話番号の形式が正しくない
これらは、特定の形式が要求される入力欄にユーザーが形式外の文字列を選択したときに表示されるメッセージです。初期状態では次のようになっています。
- 入力されたメールアドレスの形式が正しくない：入力されたメールアドレスに間違いがあります。
- 入力された URL の形式が正しくない：URL に間違いがあります。
- 入力された電話番号の形式が正しくない：電話番号に間違いがあります。
どれも気にならない方はこのままでいいのですが、管理人とみーは次のようにしています。
- 入力されたメールアドレスの形式が正しくない：
入力されたメールアドレスの形式が正しくありません。
- 入力された URL の形式が正しくない：
入力されたURLの形式が正しくありません。
- 入力された電話番号の形式が正しくない：
入力された電話番号の形式が正しくありません。
「間違いがあります」だけだと「このメールアドレスは使えないのかな…」など、あまり関係がない部分に気を遣わせてしまうため、個人的には「形式が正しくない」と伝えてもらった方が「@や.を打ち間違えたかな」と気付きやすいのではないかと思います。
設定を保存してお問い合わせフォームを設置
すべての項目の設定・チェックが終わったら、画面下の「保存」を忘れずにクリックしましょう。
お問い合わせフォームをまだ設置していない方は、こちらの記事を参考に早速お問い合わせフォームを設置しましょう！
長い設定お疲れ様でした！これでContact Form 7の基本設定は完了です！次のステップとして、これまでに設定した内容がきちんと動作しているかを確認するためのデモモードを設定できる「その他の設定」タブの設定を見ていくことをおすすめします！
コメント