Article Schema Generator

What Google can show

Google doesn't require any properties for Article, but uses headline, image, author and dates for article features and Top Stories.

Required and recommended properties

Google needs these for Article markup to be valid:

A complete example

The example values in the generator above produce this:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "BlogPosting",
  "headline": "How to brew better coffee at home",
  "description": "Five changes that make the biggest difference, from grind size to water temperature.",
  "url": "https://www.example.com/blog/better-coffee",
  "mainEntityOfPage": "https://www.example.com/blog/better-coffee",
  "image": [
    "https://www.example.com/images/coffee-1200.jpg"
  ],
  "datePublished": "2026-09-14",
  "dateModified": "2026-10-02",
  "author": [
    {
      "@type": "Person",
      "name": "Jane Doe",
      "url": "https://www.example.com/about/jane"
    }
  ],
  "publisher": {
    "@type": "Organization",
    "name": "Example Coffee Co",
    "logo": {
      "@type": "ImageObject",
      "url": "https://www.example.com/logo.png"
    }
  }
}
</script>

Where to paste the code

• WordPress: check what your SEO plugin (Yoast, Rank Math) already outputs, then add the block with a header-code plugin such as WPCode, or in your child theme's header.php before </head>. For one page only, use a Custom HTML block in that page.
• Shopify: for site-wide markup such as Organization, go to Online Store › Themes › Edit code and paste it in theme.liquid before </head>. For products, edit the product section (often main-product.liquid) and use Liquid variables such as {{ product.title | json }} so every product gets its own values. Most themes already output basic Product markup.
• Next.js: render it in the page component as <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(data).replace(/</g, "\\u003c") }} />. Escaping < stops a value from closing the script tag early; this site does the same.
• Webflow: Page settings › Custom code › Inside <head> tag. For CMS collection pages, add it to the template's page settings and insert fields from the collection.

Test before you publish

Paste the code into Google's Rich Results Test, then test the live page once it's published. Make sure every value matches what people see on the page.