productOptionsReorder

mutation

Requires write_products access scope. Also: The user must have a permission to update product variants.

Reorders options and option values on a product, causing product variants to alter their position.

Options order take precedence over option values order. Depending on the existing product variants, some input orders might not be achieved.

Example: Existing product variants: ["Red / Small", "Green / Medium", "Blue / Small"].

New order: [ { name: "Size", values: [{ name: "Small" }, { name: "Medium" }], name: "Color", values: [{ name: "Green" }, { name: "Red" }, { name: "Blue" }] } ].

Description: Variants with "Green" value are expected to appear before variants with "Red" and "Blue" values. However, "Size" option appears before "Color".

Therefore, output will be: ["Small / "Red", "Small / Blue", "Medium / Green"].

Arguments

Anchor to optionsoptions • [OptionReorderInput!]!required: Options to reorder on the product.
Anchor to productIdproductId • ID!required: The ID of the product to update.

Was this section helpful?

Anchor to ProductOptionsReorderPayload returnsProductOptionsReorderPayload returns

Anchor to productproduct • Product: The updated product object.
Anchor to userErrorsuserErrors • [ProductOptionsReorderUserError!]!non-null: The list of errors that occurred from executing the mutation.

Was this section helpful?

Reorder options and change the order of option values
Trying to reorder option values with any value missing in the input returns an error
productOptionsReorder reference

Examples

1const { admin } = await authenticate.admin(request);
2
3const response = await admin.graphql(
4  `#graphql
5  mutation reorderOptions($options: [OptionReorderInput!]!, $productId: ID!) {
6    productOptionsReorder(options: $options, productId: $productId) {
7      userErrors {
8        field
9        message
10        code
11      }
12      product {
13        id
14        options {
15          id
16          name
17          values
18          position
19          optionValues {
20            id
21            name
22            hasVariants
23          }
24        }
25        variants(first: 5) {
26          nodes {
27            id
28            title
29            selectedOptions {
30              name
31              value
32            }
33          }
34        }
35      }
36    }
37  }`,
38  {
39    variables: {
40      "productId": "gid://shopify/Product/1072481054",
41      "options": [
42        {
43          "name": "Color",
44          "values": [
45            {
46              "name": "Green"
47            },
48            {
49              "name": "Blue"
50            },
51            {
52              "name": "Red"
53            }
54          ]
55        },
56        {
57          "name": "Size"
58        }
59      ]
60    },
61  },
62);
63
64const data = await response.json();
65

mutation reorderOptions($options: [OptionReorderInput!]!, $productId: ID!) {
  productOptionsReorder(options: $options, productId: $productId) {
    userErrors {
      field
      message
      code
    }
    product {
      id
      options {
        id
        name
        values
        position
        optionValues {
          id
          name
          hasVariants
        }
      }
      variants(first: 5) {
        nodes {
          id
          title
          selectedOptions {
            name
            value
          }
        }
      }
    }
  }
}

curl -X POST \
https://your-development-store.myshopify.com/admin/api/2024-10/graphql.json \
-H 'Content-Type: application/json' \
-H 'X-Shopify-Access-Token: {access_token}' \
-d '{
"query": "mutation reorderOptions($options: [OptionReorderInput!]!, $productId: ID!) { productOptionsReorder(options: $options, productId: $productId) { userErrors { field message code } product { id options { id name values position optionValues { id name hasVariants } } variants(first: 5) { nodes { id title selectedOptions { name value } } } } } }",
 "variables": {
    "productId": "gid://shopify/Product/1072481054",
    "options": [
      {
        "name": "Color",
        "values": [
          {
            "name": "Green"
          },
          {
            "name": "Blue"
          },
          {
            "name": "Red"
          }
        ]
      },
      {
        "name": "Size"
      }
    ]
  }
}'

const { admin } = await authenticate.admin(request);

const response = await admin.graphql(
  `#graphql
  mutation reorderOptions($options: [OptionReorderInput!]!, $productId: ID!) {
    productOptionsReorder(options: $options, productId: $productId) {
      userErrors {
        field
        message
        code
      }
      product {
        id
        options {
          id
          name
          values
          position
          optionValues {
            id
            name
            hasVariants
          }
        }
        variants(first: 5) {
          nodes {
            id
            title
            selectedOptions {
              name
              value
            }
          }
        }
      }
    }
  }`,
  {
    variables: {
      "productId": "gid://shopify/Product/1072481054",
      "options": [
        {
          "name": "Color",
          "values": [
            {
              "name": "Green"
            },
            {
              "name": "Blue"
            },
            {
              "name": "Red"
            }
          ]
        },
        {
          "name": "Size"
        }
      ]
    },
  },
);

const data = await response.json();

const client = new shopify.clients.Graphql({session});
const data = await client.query({
  data: {
    "query": `mutation reorderOptions($options: [OptionReorderInput!]!, $productId: ID!) {
      productOptionsReorder(options: $options, productId: $productId) {
        userErrors {
          field
          message
          code
        }
        product {
          id
          options {
            id
            name
            values
            position
            optionValues {
              id
              name
              hasVariants
            }
          }
          variants(first: 5) {
            nodes {
              id
              title
              selectedOptions {
                name
                value
              }
            }
          }
        }
      }
    }`,
    "variables": {
      "productId": "gid://shopify/Product/1072481054",
      "options": [
        {
          "name": "Color",
          "values": [
            {
              "name": "Green"
            },
            {
              "name": "Blue"
            },
            {
              "name": "Red"
            }
          ]
        },
        {
          "name": "Size"
        }
      ]
    },
  },
});

session = ShopifyAPI::Auth::Session.new(
  shop: "your-development-store.myshopify.com",
  access_token: access_token
)
client = ShopifyAPI::Clients::Graphql::Admin.new(
  session: session
)

query = <<~QUERY
  mutation reorderOptions($options: [OptionReorderInput!]!, $productId: ID!) {
    productOptionsReorder(options: $options, productId: $productId) {
      userErrors {
        field
        message
        code
      }
      product {
        id
        options {
          id
          name
          values
          position
          optionValues {
            id
            name
            hasVariants
          }
        }
        variants(first: 5) {
          nodes {
            id
            title
            selectedOptions {
              name
              value
            }
          }
        }
      }
    }
  }
QUERY

variables = {
  "productId": "gid://shopify/Product/1072481054",
  "options": [{"name"=>"Color", "values"=>[{"name"=>"Green"}, {"name"=>"Blue"}, {"name"=>"Red"}]}, {"name"=>"Size"}]
}

response = client.query(query: query, variables: variables)

Input variables

JSON

1{
2  "productId": "gid://shopify/Product/1072481054",
3  "options": [
4    {
5      "name": "Color",
6      "values": [
7        {
8          "name": "Green"
9        },
10        {
11          "name": "Blue"
12        },
13        {
14          "name": "Red"
15        }
16      ]
17    },
18    {
19      "name": "Size"
20    }
21  ]
22}

Response

JSON

1{
2  "productOptionsReorder": {
3    "userErrors": [],
4    "product": {
5      "id": "gid://shopify/Product/1072481054",
6      "options": [
7        {
8          "id": "gid://shopify/ProductOption/1064576509",
9          "name": "Color",
10          "values": [
11            "Green",
12            "Blue",
13            "Red"
14          ],
15          "position": 1,
16          "optionValues": [
17            {
18              "name": "Green",
19              "hasVariants": true
20            },
21            {
22              "name": "Blue",
23              "hasVariants": true
24            },
25            {
26              "name": "Red",
27              "hasVariants": true
28            }
29          ]
30        },
31        {
32          "id": "gid://shopify/ProductOption/1064576508",
33          "name": "Size",
34          "values": [
35            "L",
36            "S",
37            "M"
38          ],
39          "position": 2,
40          "optionValues": [
41            {
42              "name": "L",
43              "hasVariants": true
44            },
45            {
46              "name": "S",
47              "hasVariants": true
48            },
49            {
50              "name": "M",
51              "hasVariants": true
52            }
53          ]
54        }
55      ],
56      "variants": {
57        "nodes": [
58          {
59            "id": "gid://shopify/ProductVariant/1070325063",
60            "title": "Green / L",
61            "selectedOptions": [
62              {
63                "name": "Color",
64                "value": "Green"
65              },
66              {
67                "name": "Size",
68                "value": "L"
69              }
70            ]
71          },
72          {
73            "id": "gid://shopify/ProductVariant/1070325061",
74            "title": "Blue / S",
75            "selectedOptions": [
76              {
77                "name": "Color",
78                "value": "Blue"
79              },
80              {
81                "name": "Size",
82                "value": "S"
83              }
84            ]
85          },
86          {
87            "id": "gid://shopify/ProductVariant/1070325062",
88            "title": "Red / M",
89            "selectedOptions": [
90              {
91                "name": "Color",
92                "value": "Red"
93              },
94              {
95                "name": "Size",
96                "value": "M"
97              }
98            ]
99          }
100        ]
101      }
102    }
103  }
104}