Adding shop pages

After finishing this tutorial, you'll know how to do the following:

• Add unique URLS for the shop in your marketplace

• Display store details and products on a single page for the shop

• You've completed the Shop discovery tutorials.

• You're familiar with custom storefronts.

Query the shop field to retrieve the shop domain and Storefront Access Token by ID.

Using the Storefront Access Token obtained above, you can create a GraphQL client to retrieve shop data from the Storefront API.

For example, the following query returns the shop's name and description, along with the url and host of the shop's primary domain.

The shop page might now look something like the following:

Retrieve a list of products from the shop and render them in a paginated list to help buyers navigate the content. For pagination, your queries to the Storefront API will accept the first, last, before, and after arguments. You'll retrieve product details and the page information and cursor, which are required for pagination.

The response body returns the product details, and the page info and cursor that are required for pagination.

The following are examples of the types of pages that you can build using this information:

• Learn how to surface a shop's product categories in the context of a marketplace.

• Share feedback on Marketplace Kit.