みなさんこんにちはALEXです。EFOキャンペーンもいよいよ後半戦です。合計７件の記事を執筆しました。
Contact Form7 Googleアナリティクスの目標に設定する
今回はバリデーションの導入についてご説明します。バリデーションとは、フォーム入力の場合、フォームに入力した内容が妥当かということを検証する、ということです。以前の記事で、
がありますが、これもバリデーションです。入力時にバリデーション表示を出して、入力時の誤りに気付いていただく、という心遣いです。
contact Form 7 のデフォルトのバリデーション
Contact Form7にもバリデーション機能があります。編集画面ー「メッセージ」が該当します。以下にデフォルトを表示します。
21種類の項目がデフォルトで導入されています。この他に、ご利用状況に応じてバリデーションを追加したいところです。今回は、氏名のフリガナチェックを行います。
氏名のフリガナをチェックする
氏名にフリガナを入力していただく場合、フリガナに全角カナが入力されているかチェックします。
フォーム側に氏名（フリガナ）を追加します。タグは以下の通りとします。
[text* furigana placeholder "例）キタムラ ツバサ"]
また、入力された文字が全角カタカナであるかを確認するためのスクリプトをfunciton.phpに記述します。
function wpcf7_validate_kana($result,$tag){
$tag = new WPCF7_Shortcode($tag);
$name = $tag->name;
$value = isset($_POST[$name]) ? trim(wp_unslash(strtr((string) $_POST[$name], "\n", " "))) : "";
if ($name === "furigana") {
if(!preg_match("/^[ァ-ヾ]+$/u", $value)) {
$result->invalidate($tag, "全角カタカナで入力してください。");
}
}
return $result;
}
add_filter('wpcf7_validate_text', 'wpcf7_validate_kana', 11, 2);
add_filter('wpcf7_validate_text*', 'wpcf7_validate_kana', 11, 2);
画面を確認しましょう。
ふりがなをひらがなにして送信します。
メッセージが表示されました。
まとめ
Contact Form7のデフォルトのバリデーション機能以外にも、function.phpにタグを記述することでオリジナルのバリデーションを追加することができます。
ありがとうございました。