WordPress

【WordPress 】MW WP Formのエラーメッセージのカスタマイズ方法

MW WP Formについて

MW WP Formは、WordPressで利用できる人気のフォーム作成プラグインの一つです。このプラグインを使うと、問い合わせフォームやアンケートフォームなど、さまざまな種類のフォームを簡単に作成できます。フォームの入力値に不備がある場合に表示されるエラーメッセージをカスタマイズすることも可能です。エラーメッセージのカスタマイズ方法について説明します。

エラーメッセージの表示位置を変更する

MW WP Formで作成したフォームにおいて、エラーメッセージの表示位置をカスタマイズすることも可能です。
通常、エラーメッセージはフォームの上部または各入力フィールドの直下に表示されますが、これを変更するにはいくつかの方法があります。
ここでは、フォーム編集画面の「バリデーションルール」で設定する方法を紹介します。

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

実際にエラーメッセージの文面と表示位置をカスタマイズする手順を紹介します。

フォームの作成

まずは「MW WP Form」で通常通りフォームを作成します。name属性の値は日本語ではなく英語で入力しておきましょう。

お名前
[mwform_text name="name" size="60"]
ふりがな
[mwform_text name="furigana" size="60"]

[mwform_bsubmit name="submit" value="送信"]送信[/mwform_bsubmit]

新しいエラーメッセージのタグ追加

続いてデフォルトのエラーメッセージを表示しないように「show_error=”false”」を追加します。

お名前
[mwform_text name="name" size="60" show_error="false"]
ふりがな
[mwform_text name="furigana" size="60" show_error="false"]

[mwform_bsubmit name="submit" value="送信"]送信[/mwform_bsubmit]

※これは「フォームタグを追加」する際に「エラーを表示しない」にチェックを入れた場合と同じ形式です。

デフォルトのエラーメッセージを非表示

新しいエラーメッセージを表示したい箇所に「mwform_error」を追加していきます。(下記の例ではinputタグの上に追加しています)keys属性には入力項目のname属性の値を記載します。

お名前
[mwform_error keys="name"]
[mwform_text name="name" size="60" show_error="false"]
ふりがな
[mwform_error keys="furigana"]
[mwform_text name="furigana" size="60" show_error="false"]

[mwform_bsubmit name="submit" value="送信"]送信[/mwform_bsubmit]

まとめ

今回は「MW WP Form」のエラーメッセージのカスタマイズ方法を紹介しました。
とても柔軟にカスタマイズできる MW WP Form は素晴らしいですね!
今までエラーメッセージはデフォルトのままだった…という方は、ぜひ今回の記事を参考に試していただければと思います。

アバター画像

h.m

グローワークスのデザイナーとして活躍中。ユーザー体験を重視したクリエイティブなデザインを目指しています。美と機能性の融合を追求し続けます!