フォームで郵便番号を入力すると住所を自動補完してくれるWordPressプラグイン「zipaddr-jp」

フォームで郵便番号を入力すると住所を自動補完してくれるWordPressプラグイン「zipaddr-jp」

フォームで郵便番号を入力すると住所を自動補完してくれるWordPressプラグイン「zipaddr-jp」

zipaddr-jpは、フォームの郵便番号を入力すると、住所を自動入力してくれるようになるWordPressプラグインです。

Contact Form 7やMW WP Formなどでフォームを作成する際に、各入力欄にIDを指定することで郵便番号から住所が自動入力されるようになります。

zipaddr-jpのインストール

インストール手順は以下の通りです。

ファイルをFTPでアップロードしてインストール

  1. zipaddr-jpをダウンロードします。
  2. ダウンロードしたファイルを展開し wp-content/plugins にアップロードします。
  3. 管理画面の[プラグイン]ページで、zipaddr-jpを有効化します。

WordPress管理画面でインストール

  1. [プラグイン] – [新規追加]にアクセスします。
  2. 「zipaddr-jp」で検索します。
  3. [今すぐインストール]をクリックして、zipaddr-jpをインストールします。
  4. [有効化]をクリックしてプラグインを有効化します。

zipaddr-jpの設定

プラグインを有効化すると、[Zipaddr-Jp]というメニューが追加されます。[Zipaddr-Jp]にアクセスすると、設定画面が開きます。

zipaddr-jpの設定
利用サイト 利用サイトの種類(有償版は利用申請が必要)
郵便番号の区切り文字 郵便番号の区切り文字
ガイダンス位置の補正 ガイダンスの位置
ガイダンス画面の文字サイズ ガイダンスの文字サイズ
placeholder上書 郵便番号入力欄のplaceholder(デフォルトは”住所自動入力”)
選択後にフォーカスするid名 住所補完後にフォーカスする入力欄のID
システム拡張用のAP識別子 WooCommerceなどで利用する場合の識別子
htmlの動的生成 htmlを動的に生成するフォームでの利用
オウンコード設定パラメータ パラメータのカスタマイズ
無条件挿入 無条件にプラグインのコードを挿入するページのURL

設定はデフォルトのままでもOKですが、特にplaceholderなどはお好みに合わせて変更しましょう。

zipaddr-jpの使い方

フォームの入力欄にそれぞれ対応したIDを追加します。

郵便番号 zip
郵便番号(分割) zip – zip1
都道府県 pref
市区 city
町村 area
その他 addr
都道府県以外をまとめる場合 pref – addr
町村以降をまとめる場合 pref – city – addr
住所をすべてまとめる場合 addr

郵便番号の入力欄を分割したり住所欄をまとめたりと、柔軟に対応可能です。

なお、都道府県はセレクトボックスにしても正常に選択してくれます。また、郵便番号はハイフンなしでもOKですし、全角で入力しても半角に変換してくれます。

プラグインの詳しい仕様については、公式ページをご参照ください。

あとがき

ajaxzip3YubinBangoといったJavaScriptのライブラリは過去に紹介したことがありますが、WordPressプラグインだと導入の手間がほとんどなくて楽ですね。

郵便番号から住所を自動入力するフォームを設置したい場合は、ぜひzipaddr-jpの導入をご検討ください。

この記事が気に入ったら
いいね!してね♪

Twitter で

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です