{"metadata":{"image":[],"title":"","description":""},"api":{"url":"","auth":"never","params":[]},"next":{"description":"","pages":[]},"title":"Getting Started","type":"basic","slug":"getting-started","excerpt":"Setting up Address Picker is a breeze – two lines of code, and you're ready to go!","body":"First, you need to include the Address Picker JavaScript file:\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"<script src=\\\"//api.addresspicker.io/widget.js?key={{ API_KEY }}\\\" type=\\\"text/javascript\\\"></script>\",\n      \"language\": \"html\"\n    }\n  ]\n}\n[/block]\nNow, you're ready to go! Just give your `<input>` a type of `addresspicker`, and it will be replaced with an instance of Address Picker:\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"<input type=\\\"addresspicker\\\" name=\\\"shipping\\\">\",\n      \"language\": \"html\"\n    }\n  ]\n}\n[/block]\nThis will add two hidden inputs to your form:\n[block:parameters]\n{\n  \"data\": {\n    \"h-0\": \"Name\",\n    \"h-1\": \"Description\",\n    \"0-0\": \"`[name]`\",\n    \"0-1\": \"This value will have the same name as your customers original input. It will contain a formatted, multi-line, cleaned string of the user's address.\",\n    \"1-0\": \"`[name]_id`\",\n    \"1-1\": \"You should save this; you'll need it if you ever want to access the raw address data or let users edit their address.\"\n  },\n  \"cols\": 2,\n  \"rows\": 2\n}\n[/block]\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Demo\"\n}\n[/block]\nHere's a demo pages where Address Picker has been implemented:\n\n  * [Staples Example](http://blowenstein93.github.io/shoppingcart)","updates":["53e803eeaa9ffc1019a28209","53e80432aa9ffc1019a2820a","543240e04483ed08009c1551"],"order":0,"isReference":false,"hidden":false,"sync_unique":"","link_url":"","link_external":false,"_id":"53de5ae684ab2b1c5eb2dd71","version":{"version":"1.0","version_clean":"1.0.0","codename":"","is_stable":true,"is_beta":false,"is_hidden":false,"is_deprecated":false,"categories":["53de5ae684ab2b1c5eb2dd6f","53de5fed84ab2b1c5eb2dd72","53de61e584ab2b1c5eb2dd75"],"_id":"53de5ae684ab2b1c5eb2dd6e","__v":3,"project":"53de5ae684ab2b1c5eb2dd6b","releaseDate":"2014-08-03T15:53:10.797Z","createdAt":"2014-08-03T15:53:10.797Z"},"__v":3,"createdAt":"2014-08-03T15:53:10.943Z","is_link":false,"project":"53de5ae684ab2b1c5eb2dd6b","comments":[],"tags":[],"category":{"sync":{"isSync":false,"url":""},"pages":["53de5ae684ab2b1c5eb2dd71","53de600484ab2b1c5eb2dd74","53e0416d02eee4c76da917ac"],"title":"Getting Started","slug":"getting-started","order":0,"from_sync":false,"reference":false,"_id":"53de61e584ab2b1c5eb2dd75","project":"53de5ae684ab2b1c5eb2dd6b","__v":1,"version":"53de5ae684ab2b1c5eb2dd6e","createdAt":"2014-08-03T16:23:01.672Z"},"user":"53de5a0384ab2b1c5eb2dd6a"}

Getting Started

Setting up Address Picker is a breeze – two lines of code, and you're ready to go!

First, you need to include the Address Picker JavaScript file: [block:code] { "codes": [ { "code": "<script src=\"//api.addresspicker.io/widget.js?key={{ API_KEY }}\" type=\"text/javascript\"></script>", "language": "html" } ] } [/block] Now, you're ready to go! Just give your `<input>` a type of `addresspicker`, and it will be replaced with an instance of Address Picker: [block:code] { "codes": [ { "code": "<input type=\"addresspicker\" name=\"shipping\">", "language": "html" } ] } [/block] This will add two hidden inputs to your form: [block:parameters] { "data": { "h-0": "Name", "h-1": "Description", "0-0": "`[name]`", "0-1": "This value will have the same name as your customers original input. It will contain a formatted, multi-line, cleaned string of the user's address.", "1-0": "`[name]_id`", "1-1": "You should save this; you'll need it if you ever want to access the raw address data or let users edit their address." }, "cols": 2, "rows": 2 } [/block] [block:api-header] { "type": "basic", "title": "Demo" } [/block] Here's a demo pages where Address Picker has been implemented: * [Staples Example](http://blowenstein93.github.io/shoppingcart)