With our delivery validation feature, you can check if the customer is eligible for delivery. Depending on the address entered in the widget, a matching delivery location will be selected.
The custom-drawn zone method checks the address that your customers entered in the widget. That address will need to be within the area you shaped in your location settings for the customer to be able to check out.
To learn more about other delivery validation methods, take a look at our Delivery validation article.
Compare delivery validation methods
If you're not sure if this is the right method for your use case, compare the validation methods we offer.
| |||
Google Maps API key | Required | Required | Required |
Recommended use | If your delivery zone is set by a straight line radius from your store | If your delivery zone is set by a driving distance from your store | If you need an unusual delivery area shape |
Example distances | 10 km | 10 km | Any distance within your custom drawn area |
Eligible addresses | Any address within 10 km straight line distance from your store | Any address within 10 km driving distance from your store | Any address within the shaded area |
Non-eligible addresses | Any address further than 10 km straight line distance from your store | Any address further than 10 km driving distance from your store | Any address outside the shaded area |
How does custom-drawn zone work?
Enabling the custom-drawn zone method will add a field to the Local delivery section of our widget.
You will need to enter your custom-drawn zone in the location settings.
Your customers will need to enter their address to check if delivery is available.
They will start typing their address and must select it from the dropdown menu.
If the address is within your custom-drawn zone, they will be able to proceed.
The address will automatically populate in the next step of the checkout, if you have Prepopulate shipping address fields setting enabled in Settings > Local Delivery.
If the address is not within your custom-drawn zone, they will get an error and not be able to proceed further.
Enable custom-drawn zone validation
Click Settings then Local Delivery.
In the Distance validation section, select Customer within a custom-drawn zone.
Enter your Google Maps API Key. If you do not have one, please follow the steps in our Creating a Google Maps API Key article.
Click Check and add API key.
If the API key is valid, it will be added.
If the API key shows as invalid, check you have copied the full API key correctly, with no blank spaces or missed characters.
If you have copied it correctly, check the troubleshooting steps in the Google Maps API article.
Tick the Enable address autocompletion setting.
If needed, ticket Ask customers to use their current location.
In the Checkout section and make sure the Prepopulate shipping address fields setting is enabled.
Click Save.
Your delivery validation settings are set, now you need to add a custom-drawn zone to every location that offers delivery.
Add custom-drawn zone to a location
Click Locations.
Click the name of the location you want to edit.
In the Local delivery section, click Edit settings.
In the Distance validation section, draw a custom shape to set your delivery area.
You can adjust the shape by clicking and dragging any of the white circles.
Click Save.
Customers who are located inside the shaded shape will be able to check out from this location.
Repeat for all locations that offer local delivery.
Change the wording in the widget
Click Settings, then click Text and Design.
In Text and design section, click Show next to Delivery widget.
Change the wording in every field containing postal code/zip code into address. You can edit:
Search field placeholder
Instructional text (optional)
User has not selected a location, date or time (if required)
Click Save.
This is how your widget will look when you change the wording.
Limitations
You can use address autocompletion if your store delivers to only one country—we don't support autocompletion for multiple countries.
We do not recommend overlapping delivery zones. If a delivery area is included in one location, it should not be included in another location.
Troubleshooting
Check if you've selected the correct validation method.
Check if you've added the correct max driving distance within a location.
Check Google Maps API article to make sure you have:
Enabled all the APIs (Maps, Geocoding, Places, Directions, Distance Matrix)
Enabled billing
Removed the restrictions on your Google Maps API key.