今回は、ワードプレスの定番プラグインの１つである『Contact Form 7』で、郵便番号から住所を自動入力するカスタマイズに関する内容です。
最近、知人から「運営しているサイトの郵便番号の住所入力が動かなくなっていた！」と連絡があったので調べてみました。
どうやら今年（2016年）の１月あたりから、Googleのライブラリでajaxzip3 が利用できなくなった様子で、それに伴い読み込むjQuery の記述を変更しなければならないようです。
jQueryの読み込み
<head>〜</head>での読み込み
1 | <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> |
固定ページへの記述
Contact Form 7 のショートコードを記述しているページに下記コードを記述します。
※投稿ページで利用されている方は、そちらに記述してください。
1 2 3 4 5 6 7 8 | <script src="https://ajaxzip3.github.io/ajaxzip3.js" charset="UTF-8"></script> <script type="text/javascript"> jQuery(function(){ jQuery('#zip').keyup(function(event){ AjaxZip3.zip2addr(this,'','address','address'); }) }) </script> |
コンタクトフォームの編集
Contact Form 7 の設定画面『フォーム』の項目で下記のように記述します。
1 2 | 【郵便番号】 [text zip id:zip 12/] 【住所】 [text address id:address] |
メールで受け取るショートコード
1 2 | 【郵便番号】 [zip] 【住所】 [address] |
以上でContact Form 7 で郵便番号から住所を自動入力する機能が復活すると思います。
Google Codeの閉鎖から未対応のままの方は、一度ご確認されてみてください。
ワードプレス-Popular Posts をカスタマイズして表示項目・ソースを変更する
ワードプレスで見出しタグのショートカットが使えない？対応キーまとめ
ワードプレスで今日からn日後の日付を取得して自動表示させる
ワードプレス-Popular Posts で同じカテゴリーに属する記事だけを表示させる
ワードプレスで特定カテゴリーの時だけデザインを変える条件分岐
ワードプレスの投稿編集画面を実際の表示と同一にするカスタマイズ
