Integrating Shopify & Crafty Clicks Postcode / Zipcode Lookup and Address Auto-complete

Integrating an address validation / lookup solution with an eCommerce platform is usually a really easy task, but I struggled with Crafty Clicks and Shopify Plus initially, so I decided to write a blog post about how I did it in the end.

When integrating with Shopify and Shopify Plus, Crafty Clicks’ suggested approach for both is to add the JavaScript to the “additional scripts” field designed in the Google Analytics setup section (online store > preferences). This, in theory, should work, but I couldn’t get it working – I even tried a number of different test stores. This may well work for some people and instructions for this approach can be seen here. In order to go down this approach, you just paste the JS for your chosen method into the scripts field in Shopify, as per the below.

Just add your API key. Most Shopify stores apparently go down this route, so feel free to try this first. This all applies for both the postcode lookup and the address auto-complete functionality.

So, the route I ended going down required me to add the code to the checkout.liquid page – I simply embedded the code just inside of the closing body tag and it worked, as can be seen below.

I also later changed the hide fields value from “false” to “true, which hides the other fields until the postcode has been looked up, which can be seen below.

This is for adding the postcode lookup option. If you want to use the address field auto-complete feature, you apply the same principle and just edit the fields as you need to. The code can also be found on this page. This whole process was super easy and straightforward, once I stopped playing around with the Google Analytics scripts route.

I also then integrated the address lookup functionality into forms on the site (powered by Formstack), which works really nicely. With this, you just add the Formstack auto complete code to the form embed code from Formstack and you’re good to go. To change the fields you again just adapt the values in the script. 

Feel free to add any issues below in the comments.