Contact Form7でカタカナ・ひらがなのバリデーションを追加する方法

はじめに

WordPressサイトでフォームを作成する際、Contact Form 7は便利なプラグインの1つです。しかし、デフォルトではフリガナのバリデーションが提供されていません。そのため、カスタムバリデーションを追加することで、ユーザーが正しいフォーマットで入力するように制限することができます。

この記事では、Contact Form 7でカタカナ・ひらがなのバリデーションを追加する方法をご紹介します。

カタカナ・ひらがなのバリデーションを追加するコード

以下のコードを使用することで、Contact Form 7のフォームフィールドに対してカタカナまたはひらがなのバリデーションを追加できます。

PHP

// Contact Form 7でカタカナ・ひらがなのバリデーション追加
function custom_cf7_kana_validation($result, $tag)
{
    $tag       = new WPCF7_Shortcode($tag);
    $fieldName = $tag->name;
    $fieldValue = isset($_POST[$fieldName]) ? trim(wp_unslash(strtr((string) $_POST[$fieldName], "\n", " "))) : "";

    // 全角カタカナまたはひらがなの入力チェック
    if ($fieldName === "your-kana") {
        if (!preg_match("/^[ア-ヶーぁ-ん]+$/u", $fieldValue)) {
            $result->invalidate($tag, "全角カタカナまたはひらがなで入力してください。");
        }
    }

    // 全角カタカナのみ
    // if ($fieldName === "your-kana") {
    //     if (!preg_match("/^[ア-ヶー]+$/u", $fieldValue)) {
    //         $result->invalidate($tag, "全角カタカナで入力してください。");
    //     }
    // }

    // ひらがなのみ
    // if ($fieldName === "your-kana") {
    //     if (!preg_match("/^[ぁ-ん]+$/u", $fieldValue)) {
    //         $result->invalidate($tag, "ひらがなで入力してください。");
    //     }
    // }

    return $result;
}
add_filter('wpcf7_validate_text', 'custom_cf7_kana_validation', 11, 2);
add_filter('wpcf7_validate_text*', 'custom_cf7_kana_validation', 11, 2);

コードの説明

custom_cf7_kana_validation関数の定義:
- $resultと$tagの引数を受け取ります。
- $tagオブジェクトをWPCF7_Shortcodeクラスとして初期化し、フォームフィールドのname属性を取得します。
- フォームフィールドの値を取得し、必要に応じてトリムおよびスラッシュ解除を行います。
バリデーションの条件設定:
- your-kanaというname属性を持つフィールドに対して、全角カタカナまたはひらがなのみを許可する正規表現を使用してバリデーションを行います。
- 条件を満たさない場合、エラーメッセージを設定します。
フィルターフックの追加:
- wpcf7_validate_textおよびwpcf7_validate_text*フックを使用して、上記のバリデーション関数を適用します。