WordPress

MW WP Formのエラーメッセージをカスタマイズする方法

WordPress
この記事は約7分で読めます。

WordPressでお問い合わせを作るときの定番プラグインだった「MW WP Form」。 開発が終了した今でも仕様的に必要で使ったり、過去に制作したサイトの修正で触ったりとなんだかんだまだ使う頻度が高いプラグインでもあります。

その中で先日、エラーメッセージのカスタマイズを久しぶりにしたところちょっと苦戦しまして…。 まだまだ使うこともあるということで、エラーメッセージのカスタマイズ方法をまとめておきたいと思います。

エラーメッセージのカスタマイズ方法

エラーメッセージをカスタマイズするには、テーマの functions.php ファイルに以下のコードを追加します。

function custom_validation_messages($validation) {
    $validation->set_rule(
        'フィールド名',
        'バリデーションルール',
        array(
            'message' => '表示したいエラーメッセージ',
        )
    );
    return $validation;
}
add_filter('mwform_validation_mw-wp-form-フォーム識別子', 'custom_validation_messages');
  • フィールド名: バリデーションを適用するフィールドのname属性の値を指定します。
  • バリデーションルール: 適用するバリデーションルールを指定します(例:noEmptynumericなど)。
  • フォーム識別子: 対象となるフォームの識別子を指定します。

例えば、メールアドレスのフィールドが未入力の場合に「メールアドレスを入力してください」というメッセージを表示させたい場合、以下のように記述します。

function custom_validation_messages($validation) {
    $validation->set_rule(
        'email',
        'noempty',
        array(
            'message' => 'メールアドレスを入力してください',
        )
    );
    return $validation;
}
add_filter('mwform_validation_mw-wp-form-フォーム識別子', 'custom_validation_messages');

エラーメッセージの表示位置のカスタマイズ

エラーメッセージの表示位置をカスタマイズするには、フォームのショートコード内で show_error=”false” を設定し、任意の位置に [mwform_error keys=”フィールド名”] を挿入します。

<label>お名前</label>
[mwform_text name="name" size="60" show_error="false"]
[mwform_error keys="name"]

<label>メールアドレス</label>
[mwform_text name="email" size="60" show_error="false"]
[mwform_error keys="email"]

バリデーションルールの一覧

MW WP Formでは、以下のようなバリデーションルールが用意されています。

名称対応名引数内容
必須項目noEmpty必須項目のチェック
必須項目(チェックボックス)requiredチェックボックス・ラジオボタンの必須項目のチェック
半角数字numeric半角数字のみ許可
半角英字alpha半角英字のみ許可
半角英数字alphaNumeric半角英数字のみ許可
カタカナkatakanaカタカナのみ許可、「ー(長音)」も許可
ひらがなhiraganaひらがなのみ許可、「ー(長音)」は拒否
ひらがな または カタカナkana
郵便番号zip日本の郵便番号の形式かをチェック
電話番号tel電話番号の形式をチェック、電話番号の形式はハイフンと+なしなら国番号付きも可能
メールアドレスmailメールアドレスの形式をチェック
日付date日付の形式をチェック
日付(年月)month日付の年月で形式をチェック
URLurlURLの形式をチェック(httpかhttpsで始まっているか否か)
一致する項目eqtarget(文字列:他のname)他のフィールドと値が一致するかをチェック
文字数の範囲betweenmin(整数値:最小文字数), max(整数値:最大文字数)文字数が指定した範囲内かをチェック
最小文字数minLengthmin(整数値:最小文字数)
拡張子制限fileTypetypes(文字列:拡張子をカンマ区切りで)jpg,pngなどで制御、「.」は不要
サイズ制限fileSizebytes(整数値:最大ファイル数をバイト単位で)
最大画像サイズmaximagesizewidth(整数値:横幅をpx単位), height(整数値:縦幅をpx単位)
最小画像サイズminimagesizewidth(整数値:横幅をpx単位), height(整数値:縦幅をpx単位)
inoptions(1次元配列)optionsで渡された配列に一致する項目がない場合にエラーを返す、セレクト、ラジオ、チェックの強化用
noFalse値がセットされていても0の場合は許さない

バリデーションルールを使用して、実際に諸々の項目を設定すると下記のようになります。

function my_custom_validations($validation) {
    // ラジオボタンの必須チェック
    $validation->set_rule(
        'radio_option',
        'required',
        array(
            'message' => 'いずれかのオプションを選択してください。',
        )
    );

    // パスワードの必須チェック
    $validation->set_rule(
        'password_field',
        'noEmpty',
        array(
            'message' => 'パスワードを入力してください。',
        )
    );

    // パスワードの最小文字数チェック
    $validation->set_rule(
        'password_field',
        'minLength',
        array(
            'min' => 8,
            'message' => 'パスワードは8文字以上で入力してください。',
        )
    );

    return $validation;
}
add_filter('mwform_validation_mw-wp-form-123', 'my_custom_validations');

MW WP Formのエラーメッセージをカスタマイズすることで、ユーザーにとってより親切なフォームを作成できます。

使用頻度は少なくなってきたプラグインではありますが、使用する際にはぜひ細かいところまでカスタマイズしてみてください。

タイトルとURLをコピーしました