Generate JSON-LD Schema Markup for Websites

Schema Markup Generator Skill adds JSON-LD structured data to pages to unlock rich results, improve CTR, and signal context to Google and AI systems. It's built around a reusable JsonLd component for Next.js App Router that serializes a schema object into a <script type="application/ld+json"> tag (escaping < to prevent script injection), imported and rendered on any page alongside the schema data object.

It provides ready-to-adapt schema templates by page type: WebSite with a SearchAction/potentialAction sitelinks searchbox for the homepage only; SoftwareApplication for tool/SaaS pages, including applicationCategory, offers pricing, featureList, and provider Organization; BlogPosting/Article with headline, dates, author Person, publisher Organization with logo, and a properly sized ImageObject; FAQPage with a mainEntity array of Question/acceptedAnswer pairs; HowTo with totalTime and numbered HowToStep entries (each with name, text, and optional image); BreadcrumbList for all non-homepage pages with positioned ListItem entries; and Organization for about/contact pages with logo, sameAs social links, and a contactPoint.

For pages needing multiple schema types - for example a tool page combining BreadcrumbList + SoftwareApplication + FAQPage - it specifies rendering each schema in its own separate <script> tag rather than merging them into one object. Validation guidance covers three tools: the Google Rich Results Test, the Schema.org Validator, and Google Search Console's Enhancements section for post-deployment warnings, plus a quick curl check to confirm the application/ld+json script actually appears in the deployed HTML (not just the source code, since framework rendering can change the final markup).

A schema markup checklist verifies: homepage has WebSite schema, tool/app pages have SoftwareApplication, blog posts have BlogPosting/Article, FAQ sections have FAQPage, step-by-step guides have HowTo, all non-homepage pages have BreadcrumbList, the about/contact page has Organization, all schema URLs are absolute HTTPS, schema passes the Google Rich Results Test, and Search Console shows no schema errors.

Use this skill when adding or auditing JSON-LD schema for websites, SaaS apps, tools, articles, FAQs, breadcrumbs, or organization pages - particularly when implementing schema in Next.js App Router or validating it against Google Rich Results and Schema.org tooling.

Do not treat valid schema as a guarantee of rich-result eligibility or display - Google and other consumers decide independently whether to use it. Generated examples must be adapted to the site's actual content, legal entity details, ratings, pricing, and availability rather than deployed as-is with placeholder data.

Input: the page type (homepage, tool/app page, blog post, FAQ, how-to guide, breadcrumb trail, or organization page) and its real content details.

Output: a JSON-LD schema object rendered via the JsonLd component, for example the FAQPage schema:

{
  "@context": "https://schema.org",
  "@type": "FAQPage",
  "mainEntity": [
    {
      "@type": "Question",
      "name": "What is keyword density?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Keyword density is the percentage of times a keyword appears in a piece of content relative to the total word count. A healthy keyword density is typically 1-3%."
      }
    }
  ]
}

Along with this it produces WebSite, SoftwareApplication, Article, HowTo, BreadcrumbList, and Organization schema, plus a validation checklist.

Web developers and SEO engineers adding structured data to a Next.js site who need concrete, page-type-specific JSON-LD templates and a validation workflow rather than researching Schema.org properties from scratch.