Skip to main content

Drop-In Script

Address Lookup is shipped in a polyfilled, typed and minified package called address-lookup.

address-lookup is designed for rapid integration on a webpage or within a bundler.

Browser Integration​

The fastest and simplest way to start is to drop our pre-bundled script onto a webpage.

Drop-In Script​

<script src="https://cdn.jsdelivr.net/npm/@addresszen/address-lookup"></script>
<script>
  AddressZen.AddressLookup.setup({
    apiKey: "zenkey",
    outputFields: {
      line_1: "#line_1",
      line_2: "#line_2",
      city: "#city",
      state: "#state',
      zip_plus_4_code: "#zipcode",
    },
  });
</script>

address-lookup ships a UMD compatible build, which targets IE11 and upwards.

The latest build can be downloaded here.

Demo​

Loading...

ES Module​

address-lookup also ships an ESM compatible build, targeting browsers with ESM support and upwards.

<script
  type="module"
  src="https://cdn.jsdelivr.net/npm/@ideal-postcodes/address-finder-bundled@3/dist/address-finder.esm.js"></script>

<script type="module">
  import { AddressLookup } from "https://cdn.jsdelivr.net/npm/@ideal-postcodes/address-finder-bundled@3/dist/address-finder.esm.js";
  AddressLookup.setup({
    apiKey: "zenkey",
    outputFields: {
      line_1: "#line_1",
      line_2: "#line_2",
      city: "#city",
      state: "#state',
      zip_plus_4_code: "#zipcode",
    },
  });
</script>

The latest build can be downloaded [here](https://cdn.jsdelivr.net/npm/@addresszen/address-lookup@1.1.0/dist/address-lookup.esm.js.

Version Control​

Serving your own versioned copy is recommended. If a JavaScript CDN is used (e.g. jsDelivr, cdnjs), we strongly recommend pinning the version.

It is important you pin your bundle version in production. Pulling directly from latest will cause your integration to fail at some point in the future.

For instance, follow the instructions on jsdelivr.com/address-lookup to pin a major version in production.

E.g.

<script src="https://cdn.jsdelivr.net/npm/@addresszen/address-lookup"></script>