{"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!