Dedicated to the Hydrogen framework, headless commerce, and building custom storefronts using the Storefront API.
Shopify Community,
I have a simple question to ask regarding the REST API and Product data structure that I believe I already understand, but I want to confirm with the community that my understanding is indeed correct.
Am I correct in stating that when you retrieve a Shopify product's information from the REST API, and the product does not have any variants, that there will always be a variant field returned in that REST API call with one member in the variants JSON array? Is this what we call the default variant for a product, even if the product is not marked as having any variants itself in the Shopify admin?
I believe the answer to this question is yes, but I would like to hear confirmation from anyone else to ensure my understanding is indeed correct. The GraphQL API is a bit more detailed in its product information returned than the REST API is.
Thank you!
Best Regards,
Daniel
Solved! Go to the solution
This is an accepted solution.
Hi Daniel
You are correct. A product with no variants has a single default variant. This is so that when you add to cart you add the product variant id.
For example if you're using GraphQL in the following:
{
products(first : 100) {
edges {
node {
variants(first: 10) {
edges {
node {
id
}
}
}
}
}
}
}
You add the variant id to the cart. In the above you would do a map in JS to add each variant id if there are many.
For example if you're using React you do
function handleAddToCart() {
products.edges.node.variants.edges.map(item => addVariantId(item.variant.id))
}
If the product only has one variant (the default one) it's like so:
function handleAddToCart() {
products.edges.node.variants.edges[0].node.id // => single variant
}
This is an accepted solution.
Hi Daniel
You are correct. A product with no variants has a single default variant. This is so that when you add to cart you add the product variant id.
For example if you're using GraphQL in the following:
{
products(first : 100) {
edges {
node {
variants(first: 10) {
edges {
node {
id
}
}
}
}
}
}
}
You add the variant id to the cart. In the above you would do a map in JS to add each variant id if there are many.
For example if you're using React you do
function handleAddToCart() {
products.edges.node.variants.edges.map(item => addVariantId(item.variant.id))
}
If the product only has one variant (the default one) it's like so:
function handleAddToCart() {
products.edges.node.variants.edges[0].node.id // => single variant
}