Skip to main content

Get Collection Details

GetCollectionDetails

Fetch a collection and its products by storefront handle using the storeCollectionByHandle query. This is ideal for landing pages or collection pages that need to display a specific collection with its products.

Use case​

Use this query when you have a collection URL or handle and want to:

  • Render collection details on a custom landing page or collection page.
  • Show collection title, description, image, and SEO metadata.
  • Display products within the collection with their variants and pricing.
  • Build a collection-based shopping experience.

Operation​

query GetCollectionDetails($storeId: ID!, $handle: String!, $locale: String) {
  storeCollectionByHandle(storeId: $storeId, handle: $handle, locale: $locale) {
    id
    title
    handle
    description
    shortDescription
    isArchived
    isVisible
    image {
      id
      src
      altText
      width
      height
    }
    seo {
      title
      description
    }
    products(connection: { first: 50 }) {
      totalCount
      nodes {
        id
        title
        handle
        shortDescription
        descriptionHtml
        images {
          id
          src
          altText
          width
          height
        }
        variants(first: 10) {
          nodes {
            id
            sku
            price {
              amount
              currencyCode
            }
            compareAtPrice {
              amount
              currencyCode
            }
            quantity
            trackQuantity
          }
        }
      }
      pageInfo {
        hasNextPage
        hasPreviousPage
        startCursor
        endCursor
      }
    }
  }
}

Example variables​

{
  "storeId": "Store_cm84j35iy02m001i89iiu2cts",
  "handle": "example-collection",
  "locale": "en"
}

Notes​

  • handle is the collection handle from the storefront URL, for example for:
    • https://pharmacy.wuiltstore.com/en/collections/example-collection
    • the handle is example-collection.
  • The query returns up to 50 products in the collection by default. Use pagination via pageInfo if you need to load more.
  • Each product includes up to 10 variants with pricing information.
  • Use the returned products data to build a product grid or list for the collection page.
  • The isArchived and isVisible fields help you determine if the collection should be displayed publicly.

GraphQL Endpoint​

https://graphql.wuilt.com

Operation: GetCollectionDetails​

Try It Out​

Query​

query GetCollectionDetails($storeId: ID!, $handle: String!, $locale: String) {
storeCollectionByHandle(storeId: $storeId, handle: $handle, locale: $locale) {
  id
  title
  handle
  description
  shortDescription
  isArchived
  isVisible
  image {
    id
    src
    altText
    width
    height
  }
  seo {
    title
    description
  }
  products(connection: { first: 50 }) {
    totalCount
    nodes {
      id
      title
      handle
      shortDescription
      descriptionHtml
      images {
        id
        src
        altText
        width
        height
      }
      variants(first: 10) {
        nodes {
          id
          sku
          price {
            amount
            currencyCode
          }
          compareAtPrice {
            amount
            currencyCode
          }
          quantity
          trackQuantity
        }
      }
    }
    pageInfo {
      hasNextPage
      hasPreviousPage
      startCursor
      endCursor
    }
  }
}
}

Query Variables

1
2
3
4
5

Note: Make sure to change the storeId with your store ID. For guidance on how to get your store ID, reference the Store ID guide.

Authentication​

To use this query, you will need an API key. Click the "API Key" button in the navigation bar to enter your credentials.