Skip to content

Get Attribute Options

About

The attributeOptions query returns attribute option values — the individual entries behind a select, multiselect, or checkbox attribute, such as Red, Green, Large.

The query is not scoped to an attribute. It pages through every option in the catalog, so Red from Colour and Large from Size arrive in the same list with nothing on a node to say which attribute it belongs to. To read the options of one attribute, query that attribute instead and select its options connection — see Get Attribute.

Use this query when a client wants the whole option set at once, typically to build a lookup table of option ID to label that it can reuse across screens.

Arguments

ArgumentTypeRequiredDescription
firstInt❌ NoNumber of options to return from the start (forward pagination). Default: 10
afterString❌ NoCursor to start after for forward pagination.
lastInt❌ NoNumber of options to return from the end (backward pagination). Default: 10
beforeString❌ NoCursor to start before for backward pagination.

There is no argument to filter by attribute, by swatch type, or by label.

Possible Returns

FieldTypeDescription
edges[AttributeOptionEdge]Option edges for the current page.
edges.nodeAttributeOptionA single option — fields below.
edges.cursorString!Cursor for this option, used as after on the next request.
pageInfoAttributeOptionPageInfo!Pagination metadata.
pageInfo.hasNextPageBooleanWhether more options follow the current page.
pageInfo.hasPreviousPageBooleanWhether options precede the current page.
pageInfo.startCursorStringCursor of the first option on the page.
pageInfo.endCursorStringCursor of the last option on the page.
totalCountInt!Total options across every attribute in the catalog.

AttributeOption Fields

FieldTypeDescription
idID!IRI-style identifier (/api/shop/attribute-options/{id}).
_idInt!Numeric option ID. This is the value to send when filtering products.
adminNameStringAdmin-facing option name. Use translation for the shopper-facing label.
sortOrderIntDisplay order within the option's own attribute.
swatchValueStringHex colour for a colour swatch, or the text value. null when the attribute uses no swatch.
swatchValueUrlStringURL of the swatch image, for image swatches.
translationAttributeOptionTranslationThe option's label in the current locale.
translationsAttributeOptionTranslationCursorConnectionThe option's label in every locale.

Translation Fields

FieldTypeDescription
idID!IRI-style translation identifier.
_idInt!Numeric translation ID.
attributeOptionIdString!ID of the option this translation belongs to.
localeString!Locale code, e.g. en, ar.
labelStringTranslated label for the option.

Use Cases

1. Caching an option-ID lookup table

A client that renders filters and product attribute values keeps hitting the same option IDs. Page the full set once and cache it:

graphql
query optionLookup($after: String) {
  attributeOptions(first: 100, after: $after) {
    edges {
      node {
        _id
        adminName
        swatchValue
        translation {
          label
        }
      }
      cursor
    }
    pageInfo {
      hasNextPage
      endCursor
    }
    totalCount
  }
}

Repeat with the returned endCursor while hasNextPage is true.

2. Resolving an option ID that came back on a product

A product's attributeValues carry option IDs rather than labels. A cached lookup built from this query turns those IDs into text without a request per product.

3. Reading the options of one attribute

This query cannot do it — use Get Attribute and select its options connection, which returns only that attribute's values in their configured order.

Best Practices

  1. Do not use this to populate one attribute's control — the result spans every attribute and carries no attribute reference, so a colour picker built from it would list sizes too; query the attribute directly instead
  2. Page with first and after — the default page is 10 options, which is smaller than most single attributes
  3. Never pass a made-up cursor — an after value that did not come from a previous response fails the request outright rather than returning an empty page
  4. Show translation.label, not adminNameadminName is the internal admin label and is never translated
  5. Cache the result — options change only when a merchant edits an attribute, so the whole set caches well and saves a request per screen

Error Scenarios

ScenarioCause
Invalid cursorThe after or before value is not a cursor returned by a previous response.

Released under the MIT License.