customers/addresses
The customers/addresses template renders the customer addresses page, which allows customers to view and manage their current addresses, as well as add new ones.
Refer to the customers/addresses template and its main section in Dawn for an example implementation.
Anchor to LocationLocation
The customers/addresses template is located in the templates > customers directory of the theme:
Anchor to ContentContent
You should include the following in your customers/account template or a section inside of the template:
Anchor to The customer objectThe customer object
You can access the Liquid customer object to display the customer account details.
Anchor to Standard form inputsStandard form inputs
Inside forms for adding or editing an address, there are standard form inputs for each address detail. The table below shows each, with their associated type and name attributes.
If you want to limit your form to accept submissions for only the places that you ship to, then you can use country_option_tags to build your country selector.
If you want to return all countries, then you can use all_country_option_tags. For an example of using all_country_option_tags as a data source to build a selector in a form, refer to the main-addresses.liquid file in the Dawn GitHub repository.
| Input | type | name |
|---|---|---|
| First name | text | address[first_name] |
| Last name | text | address[last_name] |
| Company | text | address[company] |
| Address 1 | text | address[address1] |
| Address 2 | text | address[address2] |
| City | text | address[city] |
| Country | select | address[country] |
| Province | select | address[province] |
| ZIP/Postal Code | text | address[zip] |
| Phone Number | tel | address[phone] |
The form inputs for each address detail must have the name attributes from this table, or the form won't submit successfully.
Anchor to UsageUsage
When working with the customers/account template, you should familiarize yourself with the following:
If you're using a JSON template, then any HTML or Liquid code needs to be included in a section that's referenced by the template.
Anchor to Add a new addressAdd a new address
You can allow customers to add a new address with the Liquid form tag and accompanying 'customer_address', customer.new_address parameters:
Example
Inside the form, you need to include the standard form inputs for capturing the various address details.
Anchor to Edit an existing addressEdit an existing address
With each existing address, you should include a form to edit it. You can add this form with the Liquid form tag and accompanying 'customer_address', address parameters:
Example
Inside the form, you need to include the standard form inputs for capturing the various address details.
Anchor to Delete an addressDelete an address
With each existing address, you should include the option to delete it. You can add this option by including the following form:
You should couple the above form with JavaScript to prompt customers to confirm that they'd like to delete an address before actually performing the deletion.