JSON-LD ยท @graph

JSON-LD Schema Generator

JSON-LD is Google's recommended structured data format. Build a single type or nest several into one connected @graph, with unique @id on every node.

One schema type at a time. Switch to graph mode to nest this with Organization, WebSite, or Breadcrumb.

Page graph builder

Add the schema types your page needs. Each node gets a unique @id and references are wired for you.

YOUR DETAILS

How to use this generator

  1. Add the nodes your page needs. Start with Organization and WebSite; add more from the dropdown.
  2. Fill in each node's fields. Click a node in the stack to edit it.
  3. Let the tool wire the @ids. References like publisher and parentOrganization are connected automatically.
  4. Copy the combined @graph into the head of your page as one script block.
  5. Validate with the Schema.org Validator and Rich Results Test.

What is JSON-LD?

JSON-LD (JavaScript Object Notation for Linked Data) is a way to embed structured data in a page inside a single script block, separate from the visible HTML. Per Google Search Central, it is the format Google recommends for structured data because it is the easiest to add and maintain.

Because it sits in its own block, JSON-LD is less likely to break when you redesign a page, and it lets you express relationships between entities cleanly. When a page describes several things at once, you combine them in one @graph with each node carrying a unique @id.

Combine types with @graph, not multiple scripts

When a page represents more than one entity, for example an Organization plus a WebSite plus a Breadcrumb, the clean approach is a single @graph array with one node per entity, rather than several separate script blocks that repeat context. This tool's graph mode does exactly that and wires the cross-references by @id.

Give every node a unique, stable @id. Shared or duplicate ids cause parsers to merge or drop nodes, which is one of the most common and hardest-to-spot structured data bugs.

Where to put the code

Paste the generated <script type="application/ld+json"> block into the <head> of the page it describes. On WordPress, a free plugin like WPCode adds header code without editing theme files, and SEO plugins such as Yoast and Rank Math accept custom JSON-LD. On a static site, paste it straight into the HTML.

Frequently asked questions

Is this JSON-LD generator free?

Yes, free and unlimited in your browser.

Why does Google prefer JSON-LD?

Because it sits in its own script block, separate from your HTML, which makes it the easiest format to add and maintain and the least likely to break on redesign.

How do I combine multiple types?

Use graph mode. It outputs one @graph with a node per type and wires references by @id, instead of many separate script blocks.

What is an @id for?

It is a stable identifier for a node so other nodes can reference it. Unique @ids prevent parsers from merging or dropping entities.

Where does the code go?

In the head of the page it describes, as a single application/ld+json script.