Schema Markup Guide for Developers: JSON-LD Examples You Can Copy

Schema markup is structured data that tells search engines exactly what your page is about: an article, a product, a business, a person. Add it with a small JSON-LD script, and Google can show rich results like stars, prices, and breadcrumbs. AI tools like ChatGPT and Google AI Overviews also use it to understand who you are.

This guide gives you copy-paste JSON-LD for the schema types that actually matter, plus how to add it in plain HTML, Next.js, and WordPress.

What Is Schema Markup?

Schema markup is a shared vocabulary from schema.org that labels your content in a machine-readable way.

Without schema, Google reads "4.8" on your page and has to guess. With schema, you tell it: this is an aggregateRating with a ratingValue of 4.8 from 120 reviews.

JSON-LD vs Microdata vs RDFa

Format	How it works	Use it?
JSON-LD	Separate <script> block	Yes. Google recommends it
Microdata	Attributes inside HTML tags	Only for legacy sites
RDFa	Attributes inside HTML tags	Rarely

JSON-LD wins because it lives in one block, doesn't touch your markup, and is easy to generate from data.

The Basic Structure

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "Schema Markup Guide for Developers"
}
</script>

• @context is always https://schema.org
• @type is the thing you are describing
• Everything else is properties of that type

You can place it in <head> or <body>. Both work.

1. Organization Schema (Every Site)

Put this on your homepage. It defines your brand as an entity.

{
  "@context": "https://schema.org",
  "@type": "Organization",
  "@id": "https://example.com/#organization",
  "name": "Example Co",
  "url": "https://example.com/",
  "logo": "https://example.com/logo.png",
  "sameAs": [
    "https://www.linkedin.com/company/example",
    "https://x.com/example",
    "https://github.com/example"
  ]
}

sameAs connects your site to your social profiles. This helps Google and AI tools confirm your brand is one consistent entity.

2. Article Schema (Blog Posts)

{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "Schema Markup Guide for Developers",
  "image": "https://example.com/images/schema-guide.jpg",
  "datePublished": "2026-10-16",
  "dateModified": "2026-10-16",
  "author": {
    "@type": "Person",
    "name": "Jane Dev",
    "url": "https://example.com/about/"
  },
  "publisher": { "@id": "https://example.com/#organization" }
}

Keep dateModified honest. Only update it when the content really changes.

3. BreadcrumbList Schema

Shows a clean path in search results instead of a raw URL.

{
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [
    { "@type": "ListItem", "position": 1, "name": "Home", "item": "https://example.com/" },
    { "@type": "ListItem", "position": 2, "name": "Blog", "item": "https://example.com/blog/" },
    { "@type": "ListItem", "position": 3, "name": "Schema Guide" }
  ]
}

The last item can skip item since it is the current page.

4. Product Schema (E-commerce)

{
  "@context": "https://schema.org",
  "@type": "Product",
  "name": "Wireless Mechanical Keyboard",
  "image": "https://example.com/keyboard.jpg",
  "sku": "KB-2026",
  "brand": { "@type": "Brand", "name": "KeyCo" },
  "offers": {
    "@type": "Offer",
    "price": "79.99",
    "priceCurrency": "USD",
    "availability": "https://schema.org/InStock",
    "url": "https://example.com/keyboard"
  },
  "aggregateRating": {
    "@type": "AggregateRating",
    "ratingValue": "4.7",
    "reviewCount": "214"
  }
}

Price and rating must match what users see on the page. Mismatches can cost you rich results.

5. LocalBusiness Schema (Local SEO)

For any business with a physical location or service area.

{
  "@context": "https://schema.org",
  "@type": "Plumber",
  "name": "City Plumbing Co",
  "url": "https://cityplumbing.com/",
  "telephone": "[phone]",
  "address": {
    "@type": "PostalAddress",
    "streetAddress": "123 Main St",
    "addressLocality": "Austin",
    "addressRegion": "TX",
    "postalCode": "78701",
    "addressCountry": "US"
  },
  "openingHours": "Mo-Fr 08:00-18:00",
  "areaServed": ["Austin", "Round Rock", "Cedar Park"]
}

Use the most specific type you can (Plumber, Dentist, Restaurant) instead of plain LocalBusiness. Name, address, and phone must match your Google Business Profile exactly.

6. FAQPage Schema

{
  "@context": "https://schema.org",
  "@type": "FAQPage",
  "mainEntity": [
    {
      "@type": "Question",
      "name": "Does schema markup improve rankings?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Not directly. It helps search engines understand your page and can unlock rich results that improve click-through rate."
      }
    }
  ]
}

Reality check: Google now shows FAQ rich results mainly for well-known government and health sites. It is still worth adding because other search engines and AI tools can read it, but don't expect FAQ dropdowns in Google for most sites.

Linking Schema Together with @graph

Instead of separate blocks, connect everything in one graph using @id.

{
  "@context": "https://schema.org",
  "@graph": [
    {
      "@type": "Organization",
      "@id": "https://example.com/#organization",
      "name": "Example Co",
      "url": "https://example.com/"
    },
    {
      "@type": "WebSite",
      "@id": "https://example.com/#website",
      "url": "https://example.com/",
      "publisher": { "@id": "https://example.com/#organization" }
    },
    {
      "@type": "Article",
      "headline": "Schema Markup Guide for Developers",
      "isPartOf": { "@id": "https://example.com/#website" },
      "publisher": { "@id": "https://example.com/#organization" }
    }
  ]
}

This tells search engines these are related entities, not random separate facts.

How to Add Schema in Next.js (App Router)

export default function BlogPost({ post }) {
  const jsonLd = {
    '@context': 'https://schema.org',
    '@type': 'Article',
    headline: post.title,
    datePublished: post.publishedAt,
    author: { '@type': 'Person', name: post.author },
  };

  return (
    <>
      <script
        type="application/ld+json"
        dangerouslySetInnerHTML={{
          __html: JSON.stringify(jsonLd).replace(/</g, '\\u003c'),
        }}
      />
      <article>{/* content */}</article>
    </>
  );
}

The .replace(/</g, '\\u003c') escapes < so user content can't break out of the script tag.

How to Add Schema in WordPress

• Install Rank Math or Yoast. Both add Organization, Article, and Breadcrumb schema automatically
• For custom types, use the plugin's schema builder
• Avoid stacking two SEO plugins. You'll get duplicate schema

How to Test Your Schema

1. Google Rich Results Test: shows which rich results your page qualifies for
2. Schema Markup Validator (validator.schema.org): checks any schema.org type, not just Google ones
3. Search Console > Enhancements: shows errors across your whole site after Google crawls it

Test before every deploy that touches templates.

Common Schema Mistakes

• Marking up content that isn't visible on the page
• Fake reviews or ratings in schema (can lead to a manual action)
• Prices in schema that don't match the page
• Duplicate schema from multiple plugins
• Using LocalBusiness with an address you don't actually have
• Forgetting to update schema when page content changes

Does Schema Help Rankings?

Not directly. Schema is not a ranking factor by itself. What it does:

• Unlocks rich results, which can raise click-through rate
• Helps Google understand entities and relationships
• Makes your content easier for AI search tools to parse and cite

Think of it as making your site easier to read for machines, not as a ranking trick.

Quick Starter Checklist

• [ ] Organization + WebSite schema on homepage
• [ ] Article schema on blog posts
• [ ] BreadcrumbList on all inner pages
• [ ] Product schema on product pages
• [ ] LocalBusiness schema for local businesses
• [ ] Tested in Rich Results Test
• [ ] No errors in Search Console

Wrapping Up

Start with Organization, Article, and Breadcrumb schema. That covers most sites. Add Product or LocalBusiness if they fit your business, test everything, and keep it in sync with the visible page.

If you want to see how schema fits into a full technical SEO setup, I share more guides on my SEO blog. Got a schema error you can't fix? Drop it in the comments.

---

I'm Mritunjoy Mondal, an AI, GEO and Local SEO expert from India.