How to fix seo product title generic on Gatsby

Steps for Gatsby

1. Locate your product page template — typically `src/templates/product.jsx` (or `.tsx`) — where each product detail page is generated via `gatsby-node.js` / File System Route API (`src/pages/products/{Product.handle}.jsx`).
2. Inside the template, destructure the fields you need from the page query result: `title`, `productType` (or `vendor`/`variants`), and any differentiating attributes such as `variants[0].title` (size/colour), `material`, or `brand`.
3. Build a rich, specific title string in the component body, e.g. `const pageTitle = \`${product.title} – ${product.variants[0].title} | ${product.vendor}\`` — choose whichever attributes make the product unique.
4. Use *Gatsby Head API* (Gatsby ≥ 4.19) by exporting a named `Head` function from the same template file — this is the modern, recommended approach and avoids the `react-helmet` peer-dependency issues.
5. Inside the `Head` export, render a `<title>` tag and a matching `<meta name='description'>` tag using the constructed string so both the SERP title and snippet are specific to the product.
6. Verify output by running `gatsby build && gatsby serve` and inspecting the rendered HTML `<head>` for each product route; confirm the title contains the product name plus at least one differentiating attribute.

What is seo product title generic?

The title tag is the clickable blue headline that appears in Google search results and in the browser tab. When a product title is generic — just a catch-all label like a category name, a symbol-only string, or a name with no distinguishing detail — Google and shoppers cannot tell your page apart from dozens of similar pages. A strong product title follows a pattern like: *[Product Name] – [Key Attribute] – [Brand]* (for example, "Magnetic Card Holder Mount – MagSafe Compatible – BrandName"). Every word in the title should help a real shopper understand exactly what they are about to buy.

Google uses the title tag as the primary signal for what a page is about and displays it as the clickable headline in search results; a vague title means lower rankings for the specific search terms your customers actually type. Shoppers who do see your listing in results are far less likely to click a generic title because it tells them nothing about the product, directly reducing your organic click-through rate and revenue. Google may also auto-rewrite a weak title to something it considers more descriptive — and that rewritten version may not represent your product accurately or include your brand name. Finally, for multilingual or character-heavy store names, Google may not understand the content at all without a descriptive, keyword-rich title accompanying the product name.

See the complete Seo product title generic guide for every platform and the full background.