How to fix thin content on Next.js (Headless)

Add meaningful, original written content to pages that contain fewer than 300 words so Google has enough substance to rank and display them confidently.

Steps for Next.js (Headless)

  1. Identify thin pages (product, collection, CMS, or landing pages) by auditing your route files in app/ (App Router) or pages/ (Pages Router) for components that render fewer than 300 words of visible text. Common culprits: app/products/[slug]/page.tsx, app/collections/[slug]/page.tsx.
  2. For each thin page, fetch rich editorial content from your headless CMS (e.g. Contentful, Sanity, Prismic) or extend your commerce API query (e.g. Shopify Storefront API metafields/metaobjects) to return a `description`, `longDescription`, `editorialBody`, or `richText` field alongside the existing product/collection data. Do this inside the server component's data-fetching function (async page component or generateStaticParams/getStaticProps).
  3. Create a reusable <PageContent> server component (e.g. components/PageContent.tsx) that accepts the rich text/HTML and renders it inside semantic HTML elements (<article>, <section>, <h2>, <p>) so crawlers see meaningful, crawlable DOM nodes — not JavaScript-gated content.
  4. Render the <PageContent> component below the hero/product information in each thin page file, passing the fetched editorial copy. Ensure the combined rendered text (product description + editorial body + features/specs) meets or exceeds 300 words.
  5. Add or update generateMetadata() in the same page file so the <title> and <meta name='description'> reflect the enriched content, reinforcing topical relevance signals for Google.
  6. Run `next build` and verify with a `curl` (or View Source) that the full text is present in the server-rendered HTML — not loaded client-side — so Googlebot receives it on the first HTTP response without executing JavaScript.
Official Next.js (Headless) documentation ↗

What is thin content?

Thin content refers to any page that has very little written text — typically fewer than 300 words — giving search engines almost nothing to analyse, understand, or match to a customer's search query. This includes product pages with only a one-line description, category pages with just a grid of images, blog posts that are barely a paragraph, and landing pages filled mostly with visuals. The word count alone isn't a magic rule, but it's a reliable signal that a page hasn't given shoppers (or Google) enough information to feel confident about what the page is and why it's valuable.

Google explicitly warns that low-quality, thin pages can drag down the perceived quality of your entire site — not just individual pages — which can suppress your rankings across the board and reduce the organic traffic that drives free sales. Thin product pages also convert poorly because shoppers who can't find enough details (materials, sizing, use-cases, FAQs) lose trust and leave without buying. Competitor sites with richer, more helpful content will consistently outrank you for the same keywords, meaning you're handing free customers to rivals. For stores running Google Shopping or Performance Max campaigns, thin landing pages also lower Quality Scores and raise ad costs.

See the complete Thin content guide for every platform and the full background.

Not sure if your Next.js (Headless) store has this?

Run a free SEOLZ scan — we’ll find thin content and every other issue across your whole site.

Scan my site free

Fix thin content on another platform