WordPress(Woo Commcerce)で郵便番号から住所を自動入力する

wordpressのプラグインで住所の自動入力できるものがあったものの、動かなかったのと、更新されてなかったので、themeのfunctions.phpで管理できるように下記のコードで対応しました。

ポイントは、県名の表示部分で、AjaxZip3.PREFMAPの県名をwoo commerceの表記と揃えたものに上書きしてるのと、woo commerceの表示切替のjsが動くように`trigger(‘change’)`を設定。

応用すれば、wordpressの郵便番号から住所を自動入力するのは大体対応できるかと。

/** * ADDR AUTO INPUT FROM ZIP CODE * */
function my_after_checkout_form(){ $js = <<< EOM
<script src="https://ajaxzip3.github.io/ajaxzip3.js" charset="UTF-8"></script>
<script type="text/javascript">
AjaxZip3.PREFMAP = [ null, '北海道', '青森', '岩手', '宮城', '秋田', '山形', '福島', '茨城', '栃木', '群馬', '埼玉', '千葉', '東京都', '神奈川', '新潟', '富山', '石川', '福井', '山梨', '長野', '岐阜', '静岡', '愛知', '三重', '滋賀', '京都', '大阪', '兵庫', '奈良', '和歌山', '鳥取', '島根', '岡山', '広島', '山口', '徳島', '香川', '愛媛', '高知', '福岡', '佐賀', '長崎', '熊本', '大分', '宮崎', '鹿児島', '沖縄'
];
(function($){	$('input#billing_postcode').attr('onKeyUp', 'AjaxZip3.zip2addr(this,"","billing_state","billing_city","billing_address_1");');	$('input#shipping_postcode').attr('onKeyUp', 'AjaxZip3.zip2addr(this,"","shipping_state","shipping_city","shipping_address_1");');	AjaxZip3.onSuccess = function() { $('#billing_state').trigger('change'); $('#shipping_state').trigger('change'); };
})(jQuery);
</script>
EOM;
echo $js;
}
add_action( 'woocommerce_after_checkout_form', 'my_after_checkout_form');