Ideal Postcodes
Ideal Postcodes is a UK address validation and postcode lookup service that can be installed on your ShopWired website to provide real-time address search on checkout and account address forms.
Key features include:
- Real-time UK address validation on billing and delivery address fields
- UK postcode lookup
- Address search on customer account address forms
Ideal Postcodes integrates with ShopWired by adding a configuration to your checkout settings or theme files so address lookup appears on supported address fields.
Account creation
Account creation
To begin using Ideal Postcodes with ShopWired, an Ideal Postcodes API key is required. This API key is entered into the installation script.
Installing Ideal Postcodes on checkout pages
Installing Ideal Postcodes on checkout pages
Use this method to install address validation on checkout billing and delivery address forms. Ideal Postcodes will provide a configuration script,similar to the example below:
<script>
window.idpcConfig = {
apiKey: "ak_xxxxxxxxxx",
postcodeLookup: true,
autocomplete: true,
autocompleteOverride: { populateOrganisation: true, populateCounty: false },
postcodeLookupOverride: { populateOrganisation: true, populateCounty: false }
};
</script>
<script async type="text/javascript" crossorigin="anonymous" src="https://cdn.jsdelivr.net/npm/@ideal-postcodes/shopwired@3.0.2/dist/shopwired.min.js"></script>
The script shown above is provided as an example only. You must copy the exact script provided in your own account, as the script and any ID values will be unique to your website.
Paste the configuration and script into the Script contents setting
- Navigate to Checkout > Design and Display in your ShopWired account
- Locate the Advanced customisation section
- Select the
JSsetting - Paste the configuration and script into the Script contents setting
- Replace
"ak_xxxxxxxxxx"with your API key from your Ideal Postcodes account - Select save changes
Once saved, Ideal Postcodes will attach address lookup to the supported checkout fields.
Theme installation
Theme installation
Use this method if you want address lookup to apply to customer account registration and address book forms. Ideal Postcodes will provide a configuration script,similar to the example below:
<script> window.idpcConfig = { apiKey: "ak_xxxxxxxxxx", // Replace with your API key postcodeLookup: true, autocomplete: true, autocompleteOverride: { populateOrganisation: true, populateCounty: false }, postcodeLookupOverride: { populateOrganisation: true, populateCounty: false } }; </script> <script async type="text/javascript" crossorigin="anonymous" src="https://cdn.jsdelivr.net/npm/@ideal-postcodes/shopwired@3.0.2/dist/shopwired.min.js"></script>
The script shown above is provided as an example only. You must copy the exact script provided in your own account, as the script and any ID values will be unique to your website.
Add this script to your theme’s master.twig file:
- Navigate to Website > Themes
- Select the
code editorfor the theme you want to edit - Open the
master.twigfile - Scroll to the bottom of the file and locate the closing
</body>tag - Paste the configuration and script immediately before the closing tag:
- Replace
"ak_xxxxxxxxxx"with your API key - Select save changes
Address lookup will apply to account address forms that use standard field names.
Testing the integration
Testing the integration
To test that Ideal Postcodes is installed correctly:
- Open your website in a private browser window
- Add a product to your basket
- Proceed to checkout
- Begin typing a UK address or postcode in the address fields
- Confirm that suggestions appear and that selecting a suggestion populates the address fields
If installed on account pages, repeat this process in the customer address book.
