How to Add Structured Data to Any Website (JSON-LD Guide)

Structured data is code you add to your pages to help search engines understand your content. When implemented correctly using JSON-LD, it can earn rich snippets in search results — star ratings, FAQ dropdowns, recipe cards, product prices, and more. These enhanced results increase click-through rates significantly.

What Is JSON-LD?

JSON-LD (JavaScript Object Notation for Linked Data) is Google’s preferred format for structured data. It’s a script block you add to the <head> or <body> of your page:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "How to Add Structured Data to Any Website",
  "datePublished": "2026-07-13",
  "author": {
    "@type": "Organization",
    "name": "seoutils.dev"
  }
}
</script>

The key advantage of JSON-LD over older formats (Microdata, RDFa) is that it’s completely separate from your HTML. You don’t need to modify your page structure — just add a script block.

Common Schema Types

Article (Blog Posts, News)

{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "Your Article Title",
  "description": "A brief description of the article.",
  "datePublished": "2026-07-13T08:00:00+00:00",
  "dateModified": "2026-07-13T10:30:00+00:00",
  "author": {
    "@type": "Person",
    "name": "Author Name",
    "url": "https://www.example.com/about"
  },
  "publisher": {
    "@type": "Organization",
    "name": "Your Brand",
    "logo": {
      "@type": "ImageObject",
      "url": "https://www.example.com/logo.png"
    }
  },
  "image": "https://www.example.com/article-image.jpg",
  "mainEntityOfPage": {
    "@type": "WebPage",
    "@id": "https://www.example.com/article-url"
  }
}

Rich result: Enhanced article appearance with publish date, author, and image.

FAQ

{
  "@context": "https://schema.org",
  "@type": "FAQPage",
  "mainEntity": [
    {
      "@type": "Question",
      "name": "How long should a meta title be?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "A meta title should be 30–60 characters long to display fully in search results."
      }
    },
    {
      "@type": "Question",
      "name": "Does heading structure affect SEO?",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "Yes — heading tags help search engines understand page structure and topic hierarchy."
      }
    }
  ]
}

Rich result: Expandable FAQ dropdowns directly in search results. These take up significant SERP real estate.

LocalBusiness

{
  "@context": "https://schema.org",
  "@type": "LocalBusiness",
  "name": "Your Business Name",
  "address": {
    "@type": "PostalAddress",
    "streetAddress": "123 Main St",
    "addressLocality": "Portland",
    "addressRegion": "OR",
    "postalCode": "97201"
  },
  "telephone": "+1-503-555-0100",
  "openingHours": "Mo-Fr 09:00-17:00",
  "url": "https://www.yourbusiness.com",
  "image": "https://www.yourbusiness.com/storefront.jpg"
}

Rich result: Business details in the Knowledge Panel and Maps results.

Product

{
  "@context": "https://schema.org",
  "@type": "Product",
  "name": "Product Name",
  "description": "Product description.",
  "image": "https://www.example.com/product.jpg",
  "brand": {
    "@type": "Brand",
    "name": "Brand Name"
  },
  "offers": {
    "@type": "Offer",
    "price": "29.99",
    "priceCurrency": "USD",
    "availability": "https://schema.org/InStock",
    "url": "https://www.example.com/product"
  },
  "aggregateRating": {
    "@type": "AggregateRating",
    "ratingValue": "4.5",
    "reviewCount": "127"
  }
}

Rich result: Price, availability, and star ratings displayed in search results.

HowTo

{
  "@context": "https://schema.org",
  "@type": "HowTo",
  "name": "How to Check Your SSL Certificate",
  "step": [
    {
      "@type": "HowToStep",
      "name": "Click the padlock icon",
      "text": "Click the padlock icon in your browser's address bar."
    },
    {
      "@type": "HowToStep",
      "name": "View certificate details",
      "text": "Click 'Certificate' or 'Connection is secure' to view the certificate."
    },
    {
      "@type": "HowToStep",
      "name": "Check the expiry date",
      "text": "Look for the 'Valid to' date to ensure the certificate hasn't expired."
    }
  ]
}

Rich result: Step-by-step instructions displayed directly in search results.

How to Add JSON-LD to Your Site

Static HTML

Add the <script> block anywhere in your page’s <head> or <body>:

<head>
  <script type="application/ld+json">
  { ... your schema ... }
  </script>
</head>

WordPress

Use a plugin like Yoast SEO, Rank Math, or Schema Pro. These generate structured data automatically based on your content. For custom schemas, add the JSON-LD to your theme’s header.php or use a custom HTML block.

Astro / Next.js / React

Add the script tag in your page component:

---
const jsonLd = { "@context": "https://schema.org", "@type": "Article", ... };
---
<script type="application/ld+json" set:html={JSON.stringify(jsonLd)} />

Shopify

Use the {% raw %}{{ ... }}{% endraw %} template syntax in your theme’s product.liquid or article.liquid files. Many themes include structured data by default.

Validation

After adding structured data, validate it:

1. Google Rich Results Test — shows which rich results your page is eligible for
2. Schema.org Validator — validates your JSON-LD syntax against the schema.org specification
3. Google Search Console → Enhancements section — shows structured data errors across your site

Common Mistakes

1. Marking up content that isn’t visible. Google requires that structured data reflects what users can actually see on the page. Don’t add FAQ schema for questions that aren’t displayed.
2. Wrong schema type. Using Article for a product page or Product for a blog post sends mixed signals.
3. Missing required properties. Each schema type has required fields. Check the schema.org docs for your type.
4. Invalid JSON syntax. A missing comma or bracket breaks the entire block. Always validate.
5. Duplicate schema blocks. Having two Article schemas on one page can confuse parsers.

How Do I Check My Structured Data?

What seoutils.dev checks: Our free audit detects all JSON-LD blocks, microdata, and RDFa on your page. We identify the schema.org types present and flag pages that are missing structured data entirely.

Run a free audit to check your structured data.

---

This is part of our Complete SEO Audit Checklist. Related: Meta Title and Description Guide | Open Graph and Twitter Cards Guide.