Reorder options and change the order of option values
Description
Reorder the [product options](https://shopify.dev/docs/api/admin-graphql/latest/objects/ProductOption)
and the order of their [option values](https://shopify.dev/docs/api/admin-graphql/latest/objects/ProductOptionValue)
for an existing product. This example demonstrates how to update a product so that the "Color" option appears before "Size",
and the color values are reordered to "Green", "Blue", and "Red". The `values` field can be omitted for an option to preserve
its existing order. The response returns the product's ID, the updated list of options (with their names, positions, and
reordered values), and the details of the product variants generated from the new option order.
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/1072481177",
"options": [
{
"name": "Color",
"values": [
{
"name": "Green"
},
{
"name": "Blue"
},
{
"name": "Red"
}
]
},
{
"name": "Size"
}
]
}
cURL
curl -X POST \
https://your-development-store.myshopify.com/admin/api/2025-04/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/1072481177",
"options": [
{
"name": "Color",
"values": [
{
"name": "Green"
},
{
"name": "Blue"
},
{
"name": "Red"
}
]
},
{
"name": "Size"
}
]
}
}'
Remix
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/1072481177",
"options": [
{
"name": "Color",
"values": [
{
"name": "Green"
},
{
"name": "Blue"
},
{
"name": "Red"
}
]
},
{
"name": "Size"
}
]
},
},
);
const data = await response.json();
Ruby
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/1072481177",
"options": [
{
"name": "Color",
"values": [
{
"name": "Green"
},
{
"name": "Blue"
},
{
"name": "Red"
}
]
},
{
"name": "Size"
}
]
}
response = client.query(query: query, variables: variables)
Node.js
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/1072481177",
"options": [
{
"name": "Color",
"values": [
{
"name": "Green"
},
{
"name": "Blue"
},
{
"name": "Red"
}
]
},
{
"name": "Size"
}
]
},
},
});
Response
{
"productOptionsReorder": {
"userErrors": [],
"product": {
"id": "gid://shopify/Product/1072481177",
"options": [
{
"id": "gid://shopify/ProductOption/1064576699",
"name": "Color",
"values": [
"Green",
"Blue",
"Red"
],
"position": 1,
"optionValues": [
{
"name": "Green",
"hasVariants": true
},
{
"name": "Blue",
"hasVariants": true
},
{
"name": "Red",
"hasVariants": true
}
]
},
{
"id": "gid://shopify/ProductOption/1064576698",
"name": "Size",
"values": [
"L",
"S",
"M"
],
"position": 2,
"optionValues": [
{
"name": "L",
"hasVariants": true
},
{
"name": "S",
"hasVariants": true
},
{
"name": "M",
"hasVariants": true
}
]
}
],
"variants": {
"nodes": [
{
"id": "gid://shopify/ProductVariant/1070325355",
"title": "Green / L",
"selectedOptions": [
{
"name": "Color",
"value": "Green"
},
{
"name": "Size",
"value": "L"
}
]
},
{
"id": "gid://shopify/ProductVariant/1070325353",
"title": "Blue / S",
"selectedOptions": [
{
"name": "Color",
"value": "Blue"
},
{
"name": "Size",
"value": "S"
}
]
},
{
"id": "gid://shopify/ProductVariant/1070325354",
"title": "Red / M",
"selectedOptions": [
{
"name": "Color",
"value": "Red"
},
{
"name": "Size",
"value": "M"
}
]
}
]
}
}
}
}
Reordering option values with any value missing in the input returns an error
Description
This example shows an attempt to reorder the option values for a product,
but one of the values is missing from the input. The mutation demonstrates
the validation that prevents reordering option values if any value is missing.
The response returns the product's ID and a user error indicating that the value is missing,
without modifying the existing option values.
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/20995642",
"options": [
{
"name": "Title",
"values": [
{
"name": "158cm"
},
{
"name": "151cm"
}
]
}
]
}
cURL
curl -X POST \
https://your-development-store.myshopify.com/admin/api/2025-04/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/20995642",
"options": [
{
"name": "Title",
"values": [
{
"name": "158cm"
},
{
"name": "151cm"
}
]
}
]
}
}'
Remix
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/20995642",
"options": [
{
"name": "Title",
"values": [
{
"name": "158cm"
},
{
"name": "151cm"
}
]
}
]
},
},
);
const data = await response.json();
Ruby
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/20995642",
"options": [
{
"name": "Title",
"values": [
{
"name": "158cm"
},
{
"name": "151cm"
}
]
}
]
}
response = client.query(query: query, variables: variables)
Node.js
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/20995642",
"options": [
{
"name": "Title",
"values": [
{
"name": "158cm"
},
{
"name": "151cm"
}
]
}
]
},
},
});
Response
{
"productOptionsReorder": {
"userErrors": [
{
"field": [
"options"
],
"message": "Missing option value '155cm'.",
"code": "MISSING_OPTION_VALUE"
}
],
"product": {
"id": "gid://shopify/Product/20995642",
"options": [
{
"id": "gid://shopify/ProductOption/328272167",
"name": "Title",
"values": [
"151cm",
"155cm",
"158cm"
],
"position": 1,
"optionValues": [
{
"id": "gid://shopify/ProductOptionValue/141051426",
"name": "151cm",
"hasVariants": true
},
{
"id": "gid://shopify/ProductOptionValue/258076414",
"name": "155cm",
"hasVariants": true
},
{
"id": "gid://shopify/ProductOptionValue/129596849",
"name": "158cm",
"hasVariants": true
}
]
}
],
"variants": {
"nodes": [
{
"id": "gid://shopify/ProductVariant/30322695",
"title": "151cm",
"selectedOptions": [
{
"name": "Title",
"value": "151cm"
}
]
},
{
"id": "gid://shopify/ProductVariant/113711323",
"title": "155cm",
"selectedOptions": [
{
"name": "Title",
"value": "155cm"
}
]
},
{
"id": "gid://shopify/ProductVariant/236948360",
"title": "158cm",
"selectedOptions": [
{
"name": "Title",
"value": "158cm"
}
]
}
]
}
}
}
}