2025.02.14
ContactForm7で都道府県のセレクトボックスを自動で追加する方法
はじめに
今回は、ContactForm7で都道府県のセレクトボックスを自動で追加する方法についての備忘録です。
ContactForm7のデフォルトフォームにある「ドロップダウンメニュー」フィールド（セレクトボックス）を使用して、都道府県を自動で追加します。ぜひ参考にしてください。
実装コード
ContactForm7の記述
[select select-pref id:select-pref data:select-pref first_as_label "-"]name や id の変更は、後の functions.php や jQuery の記述にも影響するため、編集する際はそれらのコードも合わせて修正してください。
functions.phpの記述
//========================================================================
// contact form7 - select 都道府県
//========================================================================
function custom_get_select_values_pref( $values, $options, $args ) {
if ( in_array( 'select-pref', $options ) ) {
$values = array(
'北海道',
'青森県','岩手県','宮城県','秋田県','山形県','福島県',
'茨城県','栃木県','群馬県','埼玉県','千葉県','東京都','神奈川県',
'新潟県','富山県','石川県','福井県','山梨県','長野県','岐阜県','静岡県','愛知県',
'三重県','滋賀県','京都府','大阪府','兵庫県','奈良県','和歌山県',
'鳥取県','島根県','岡山県','広島県','山口県',
'徳島県','香川県','愛媛県','高知県',
'福岡県','佐賀県','長崎県','熊本県','大分県','宮崎県','鹿児島県','沖縄県',
);
}
return $values;
}
add_filter( 'wpcf7_form_tag_data_option', 'custom_get_select_values_pref', 10, 3 );ContactForm7が提供するフィルターフック 「wpcf7_form_tag_data_option」 を活用し、都道府県のセレクトボックスに option を動的に追加します。 関連記事
都道府県の数が多いため、エリアごとにグループ化すると、より見やすくなりますね。
ContactForm7のオプションをグループ化するには、jQueryを使用して実装 できます。
以下の記事を参考にしてjQueryを記述すれば、都道府県をエリアごとにグループ化できます。具体的なコードが以下になります。
//========================================================================
// contact form7 - select 都道府県
//========================================================================
function custom_get_select_values_pref( $values, $options, $args ) {
if ( in_array( 'select-pref', $options ) ) {
$values = array(
'optgroup-北海道','北海道','endoptgroup','<hr>',
'optgroup-東北','青森県','岩手県','宮城県','秋田県','山形県','福島県','endoptgroup','<hr>',
'optgroup-関東','茨城県','栃木県','群馬県','埼玉県','千葉県','東京都','神奈川県','endoptgroup','<hr>',
'optgroup-中部','新潟県','富山県','石川県','福井県','山梨県','長野県','岐阜県','静岡県','愛知県','endoptgroup','<hr>',
'optgroup-近畿','三重県','滋賀県','京都府','大阪府','兵庫県','奈良県','和歌山県','endoptgroup','<hr>',
'optgroup-中国','鳥取県','島根県','岡山県','広島県','山口県','endoptgroup','<hr>',
'optgroup-四国','徳島県','香川県','愛媛県','高知県','endoptgroup','<hr>',
'optgroup-九州','福岡県','佐賀県','長崎県','熊本県','大分県','宮崎県','鹿児島県','沖縄県',
);
}
return $values;
}
add_filter( 'wpcf7_form_tag_data_option', 'custom_get_select_values_pref', 10, 3 );実際のページで問題なく動いていたら作業は完了となります。