郵便番号から住所を自動表示する方法ってありませんか?
プラグインを使えばできます!
一緒に見ていきましょう!
この記事を読めばわかること
- Snow Monkey Formsで郵便番号から自動で住所を表示する方法がわかる
- zipaddr-jpがなにかわかる
今回説明するプラグインはContact Form 7やMW WP Formでも利用できます。
zipaddr-jpのインストール
郵便番号から住所を自動表示するためには「zipaddr-jp」というプラグインを使います。
WordPress管理画面からプラグイン→新規追加をクリックし、zipaadr-jpを入力してインストールしましょう。
プラグインを有効化すると管理画面に「Zipaddr-JP」が追加されてます。
クリックすると色々設定できますが、特に変更するところはありません。
Snow Monkey Formsの設定
zipaddr-jpをインストールしたら次はSnow Monkey Formsの設定をしていきます。
今回は郵便番号を自動表示させることにフォーカスしてまとめています。
そのため、Snow Monkey Forms自体の設定は一部省いていますのでご了承ください。
Snow Monkey Formsのインストール
プラグインの追加方法は先ほどと同じように進めていきます。
Snow Monkey Formsの設定
プラグインを有効化するとSnow Monkey Formsが追加されていますので新規追加をクリックします。
「フォーム設定を開く」をクリックし、今回はフォームスタイルを「ビジネス」にしてみましょう。
次にお問い合わせの項目を追加して、郵便番号と住所を追加していきます。
入力画面の一番下の+マークをクリックし、「郵便番号」、「都道府県」、「市区町村」、「番地」を追加していきます。
項目が追加できたら、追加したテキストを選択した上で追加設定を開き、idを設定していきます。
idは必ず以下のように設定してください。idが違うと自動で住所が表示されません。
- 郵便番号:zip
- 都道府県:pref
- 市区町村:city
- 番地:addr
合わせてバリエーションを必須に変更します。
必須にすることで入力されていない場合はフォームが送信されません。
番地は入力エリアが狭いので、sizeを100に変更します。
最後に郵便番号から番地までがメッセージの下に来ているので位置を変更しましょう。
これで郵便番号を自動で表示させる準備ができました。
固定ページにフォームを表示
最後に固定ページで設定したフォームを表示させるようにします。
まずは固定ページを新規追加します。
「SNOW MONKEY BLOCKS」の「セクション」を追加し、タイトルに「お問い合わせフォーム」と記入します。
次にセクションの中に、「SNOW MONKEY FORMS」の「Snow Monkey Forms」を追加し、自分が作成したフォームを選択します。
これでお問い合わせフォームの作成もできました。
まとめ
画像も多くて説明が長くなりましたが、「zipaddr-jp」をインストールするだけです。
設定も指定のidに変更するぐらいですので、お問い合わせフォームに住所を入れる場合は必ず入れましょう!
この記事を読んでもわからないことがあれば、TwitterのDMにてご連絡いただければ回答しますので、お気軽にご相談ください。