Support local pickup on storefronts
You can display whether a product is in stock and available for local pickup using the Storefront API. Customers can then pick up their online orders at a retail store, a curbside pickup location, or any location that a merchant chooses.
This tutorial shows you how to support local pickup on a custom storefront.
RequirementsAnchor link to section titled "Requirements"
- You've reviewed and met the requirements that are listed on the Querying data with the Storefront API page.
- You've created products and variants in your store.
- You've enabled local pickup for one or more of your locations.
To use the GraphQL queries, your app must request the
unauthenticated_read_product_pickup_locations access scope for a Shopify store.
API componentsAnchor link to section titled "API components"
You can display a product's availability for local pickup using the following API components:
StoreAvailability: An object that represents a product variant’s availability for in-store pickup at a location, including the estimated amount of time that it takes for the pickup to be ready.
StoreAvailabilityis a connection field on the
Location: An object that represents a physical location, including the location's name, address, and latitude and longitude coordinates.
@inContext: A directive that provides the ability to contextualize the response. For example, the
@inContextdirective accepts a
preferredLocationIdargument which effects how in-store availability results are sorted.
Determine pickup availability for a product variantAnchor link to section titled "Determine pickup availability for a product variant"
When a user selects a particular product variant, you can query for its in-store pickup availability.
storeAvailability object, you can query whether a variant is in stock at a location (
available), the location where the variant is stocked (
location), and the estimated amount of time that it takes for the pickup to be ready (
The response includes a list of pickup locations that are sorted alphabetically by city and location name.
Retrieve in-store pickup locationsAnchor link to section titled "Retrieve in-store pickup locations"
You might want to show customers a list of available locations so that they can establish a preferred one for future queries.
To retrieve this list, you can use the
locations field available on the
QueryRoot object. If you want to sort the results based on proximity to the customer's current location, then you can also pass a
near argument that contains a latitude and longitude value.
Use the customer's preferred locationAnchor link to section titled "Use the customer's preferred location"
storeAvailability objects are sorted by city and name. To sort them by proximity to the customer's preferred location, you can pass a location ID using the
preferredLocationId argument of the
- Learn how to manage a cart in Shopify with the Storefront API.
- Learn how to manage customer accounts with the Storefront API.
- Support multiple languages on a custom storefront with the Storefront API.
- Learn about the different tools that you can use to create unique buying experiences anywhere your customers are, including websites, apps, and video games.