タイトルの通りです。
WordPressのお問い合わせフォームはいつもContact Form 7を使うのですが、住所を入力してもらう際に郵便番号から自動入力ができたらいいなと探したのでメモ。
目次
使用プラグイン
zipaddr-jp 設定
とりあえずインストールするだけでOK。
詳しく設定をしたい方は公式の解説ページをご確認ください。
Contact Form 7 設定
Contact Form 7プラグインの基本的な操作については省略します。
資料請求される方に住所を任意で入力いただきたいので、今回のサンプルでは電話番号と問い合わせ内容の間に該当のコードを入れることにします。
Contact Form 7 側でのzipaddr-jp フォーム設定
郵便番号、都道府県、市区町村、地域、各欄を設定するために、テキストボックスを追加する。
その際、zipaddr-jpを使うためには各項目のidを決められたものに設定することが大事。
郵便番号 … zip
都道府県 … pref
市区町村 … city
地域 … area
各欄 … addr
今回任意だけど必須にしたい人は必須にしたり属性を追加したり適宜修正してください。
ざっくりこんな感じ。微調整が必要なら適宜修正してください。
実際の表示
サンプルの住所は！！ナゴドだよ！！！！！
ハイフンをいれなくても自動的にハイフンを入れてくれるけど、必要なら郵便番号のところに「半角数字で入力してください」みたいなのがあってもいいかも。
Contact Form 7 側でのzipaddr-jp メール設定
届くメールに内容がはいっていないといけないのでメッセージ本文にも加えておく。
実際に送受信テストして、うまくいけばOK。
