How to fix seo product missing stock status on Gatsby
Add a visible stock availability label and an `availability` property to your Product structured data so Google can display rich results and shoppers know immediately whether a product is in stock.
Steps for Gatsby
- Open your product page template (e.g. src/templates/product.jsx or src/pages/products/{handle}.jsx). This is where both the Head export and the rendered JSX live.
- Import Gatsby's Head API export (named `Head`) alongside your page component. Inside the `Head` export, build a JSON-LD <script> tag that includes the `offers.availability` property mapped from your CMS/commerce stock field (e.g. `availableForSale`, `stockStatus`, `quantityAvailable`).
- Map your commerce platform's stock value to the correct schema.org URL: `https://schema.org/InStock`, `https://schema.org/OutOfStock`, or `https://schema.org/PreOrder`. Never hard-code a single value — derive it dynamically from the page's data prop.
- In the page component's JSX, render a visible stock-status label (e.g. a <span> or <p>) so shoppers and assistive technologies can read the availability without relying solely on structured data. Style it with a clear colour convention (green for in-stock, red for out-of-stock).
- Run `gatsby build && gatsby serve` and validate the JSON-LD output with Google's Rich Results Test (https://search.google.com/test/rich-results) to confirm the `availability` field is present and resolves to a valid schema.org URL.
- If your stock data is not yet fetched in the GraphQL page query, extend the query to include the relevant availability field (e.g. `availableForSale` from Shopify Storefront API or equivalent) so the Head export always receives live data.
What is seo product missing stock status?
Every product page should tell both shoppers and search engines whether the item is currently in stock, out of stock, or on pre-order. There are two places this needs to happen: (1) a visible on-page label like "In Stock" or "Out of Stock" that any visitor can read, and (2) a machine-readable `availability` value inside the Product structured data (schema.org JSON-LD) that Google reads to power rich results in Search and Shopping. When either piece is missing, the page has "no clear stock availability."
Google's guidelines for Product rich results explicitly require the `availability` field — without it, your product page is ineligible for the enhanced Shopping appearance in Google Search (star ratings, price, availability badge), meaning you lose prominent, high-click-rate real estate to competitors who have it. From a conversion standpoint, shoppers who cannot tell at a glance whether a product is available are more likely to bounce or abandon — especially on mobile. If you sell through Google Merchant Center, mismatched or absent availability data can also trigger feed disapprovals, further suppressing your paid and free listing visibility.
See the complete Seo product missing stock status guide for every platform and the full background.
Not sure if your Gatsby store has this?
Run a free SEOLZ scan — we’ll find seo product missing stock status and every other issue across your whole site.
Scan my site free