GraphQL query
query { product(handle: "cotton-tshirt") { variants(first: 100) { edges { node { id title price sku availableForSale selectedOptions { name value } } } } } }
Authentication
Public token for browser (read-only). Private access token for server-side (mutations).
Variant availability
availableForSale field. Combines inventory + selling channel status. Use for showing sold-out UI.
Adding to cart
cartLinesAdd mutation with merchandiseId = variant ID. Line-item properties via attributes.
Frequently asked questions
How to query Shopify variants via Storefront API?
GraphQL query on product with variants(first: N) selection. Returns variant details.
Storefront vs Admin API for variants?
Storefront: read-only, public (or authenticated). Admin: full CRUD, requires app auth.
Query variant inventory?
availableForSale field. Or quantityAvailable on Plus.
Add variant to cart via API?
cartLinesAdd mutation with merchandiseId + quantity.
Line-item properties via API?
attributes field on cartLinesAdd input. Array of key-value pairs.
Rate limits on Storefront API?
1000 requests/min per IP. Cost-based (complex queries cost more).
Best framework for headless Shopify?
Hydrogen (Shopify's official). Next.js + Shopify Storefront API. Nuxt for Vue.
Cache Storefront API responses?
Yes for product catalog. Not for cart or inventory (real-time).
Related reading
Try it free on Shopify
Print It My Way's permanent Free plan includes live preview, custom options, and Cart Transform pricing.
Install Print It My Way