This post shows how to generate that block from your article data, avoid two common bugs, and test the result.

What JSON-LD is

JSON-LD (JavaScript Object Notation for Linked Data) is a way to embed structured data in a page using a <script type="application/ld+json"> tag. The vocabulary comes from schema.org, which defines types such as Article, NewsArticle and BlogPosting and the properties each one can have.

Google's Article structured data documentation covers all three types. It lists no required properties for articles, but recommends several: headline, image, datePublished, dateModified and author. Adding them helps search engines show the right title, image, date and byline.

A minimal NewsArticle block

Here is what we want to generate:

{
  "@context": "https://schema.org",
  "@type": "NewsArticle",
  "headline": "City council approves new cycle lanes",
  "image": [
    "https://example.com/images/cycle-lanes-16x9.jpg"
  ],
  "datePublished": "2026-10-19T08:30:00+05:30",
  "dateModified": "2026-10-19T11:05:00+05:30",
  "author": [
    {
      "@type": "Person",
      "name": "Asha Rao",
      "url": "https://example.com/authors/asha-rao"
    }
  ]
}

Note the dates: use ISO 8601 with a time zone offset. A date with no time zone forces search engines to guess.

Generating it from your article data

Hand-writing JSON-LD for every story doesn't scale. Generate it from whatever your CMS already stores. Here's a small framework-agnostic JavaScript function:

function buildNewsArticleJsonLd(article) {
  const data = {
    "@context": "https://schema.org",
    "@type": "NewsArticle",
    headline: article.title,
    datePublished: new Date(article.publishedAt).toISOString(),
    dateModified: new Date(article.updatedAt ?? article.publishedAt).toISOString(),
    author: article.authors.map((a) => ({
      "@type": "Person",
      name: a.name,
      ...(a.profileUrl && { url: a.profileUrl }),
    })),
  };

  if (article.images?.length) {
    data.image = article.images.map((img) => img.url);
  }

  return data;
}

A few details:

• dateModified falls back to datePublished when a story has never been updated, so the field is always present and never earlier than the publish date.
• Authors are an array of Person objects with a profile URL where you have one. That handles single and multiple bylines the same way. If a piece genuinely has no individual author, Organization is also a valid @type.
• toISOString() returns UTC with a Z suffix. That's valid ISO 8601, so you don't need to format local offsets yourself.

Bug #1: Breaking out of the script tag

The obvious way to put this in a page is:

const html = `<script type="application/ld+json">${JSON.stringify(data)}</script>`;

This has a subtle problem. JSON.stringify does not escape <. If a headline or author name ever contains the text </script>, whether by accident or because someone typed it on purpose, the browser closes your script tag early and treats the rest as HTML. On a site that accepts any user-supplied text, that's an injection risk.

The fix is to escape < after serialising:

function toJsonLdScript(data) {
  const json = JSON.stringify(data).replace(/</g, "\\u003c");
  return `<script type="application/ld+json">${json}</script>`;
}

< is still a valid way to write < inside a JSON string, so search engines read the same data, but the browser no longer sees a closing tag.

If you use a framework that injects raw HTML, such as dangerouslySetInnerHTML in React, the same escaping applies. The framework won't do it for you.

Bug #2: Structured data that doesn't match the page

Structured data should describe what readers actually see. Common mismatches:

• The JSON-LD headline is an SEO title that doesn't match the visible headline.
• dateModified updates on every deploy or cache rebuild, even when the story itself hasn't changed.
• The image in JSON-LD isn't on the page at all.

The second one is easy to cause by accident. Take dateModified from the time an editor last changed the story's content, not from the file's last-write time or the build time.

Testing

Use two free tools:

1. Google's Rich Results Test checks whether Google can read your markup and whether the page is eligible for rich results.
2. Schema Markup Validator checks your markup against the full schema.org vocabulary, independent of any search engine.

Run both on a few real article URLs after deploying, including one with multiple authors and one that has been updated after publishing.

Putting it together

const article = {
  title: "City council approves new cycle lanes",
  publishedAt: "2026-10-19T03:00:00Z",
  updatedAt: "2026-10-19T05:35:00Z",
  authors: [{ name: "Asha Rao", profileUrl: "https://example.com/authors/asha-rao" }],
  images: [{ url: "https://example.com/images/cycle-lanes-16x9.jpg" }],
};

const scriptTag = toJsonLdScript(buildNewsArticleJsonLd(article));
// insert scriptTag into the <head> or <body> of the article page

Wrapping up

Structured data is a small amount of code with a lot of quiet benefits: clearer search results and a cleaner signal of who wrote what and when. Generate it from your real article data, escape it before inserting it into HTML, keep it in sync with what readers see, and test it on real pages.

The author writes for the Technology section of Peepals, a seven-section news network. https://peepalsglobal.com/