Contact Form 7のフォーム内で、ドロップダウンメニュー(セレクトボックス)に初期値「選択してください」を追加する方法をご紹介いたします。
ドロップダウンメニューを挿入した場合、デフォルトの状態だと最初の選択肢が初期値として選択された状態になります。空の項目を先頭に挿入する”include_blank”を使えば、初期値に「—以下から選択してください—」が追加されますが、任意のテキストに変更することができません。
任意のテキストで初期値を追加する方法をご紹介いたします。
Contact Form 7のドロップダウンメニューに初期値として「選択してください」など任意の項目を追加する方法
ドロップダウンメニューに任意の初期値を追加するには”first_as_label”をショートコードに追記します。
[select* contact-type first_as_label "選択してください" "お仕事のご相談" "採用のご相談" "その他"]上記のようにfirst_as_labelを追記して、選択肢の最初に”選択してください”を入れることで、初期値が”選択してください”になります。”選択してください”は任意のテキストに変更可能です。
上記は必須項目になっていますが、”選択してください”は未入力判定になるため、”選択してください”のままにしているとバリデーションに引っかかりエラーが表示されます。
あとがき
ドロップダウンメニューを設置するフォームでは、ほぼほぼfirst_as_labelで初期値を設定しています。
Contact Form 7のフォーム内に設置しているドロップダウンメニューで、任意の初期値を追加したい場合はぜひ参考にしていただければと思います。