Back to Workshop resources
SEO · AEO · GEO1 min read

JSON-LD in Next.js — structured data without a library.

A `<script type="application/ld+json">` tag in your component is all you need. Here's where to put it.

Haojun See
Haojun See

Founder & Director, On The Ground

Updated 6 June 2026

Overview

JSON-LD tells Google and AI engines what your page is *about* in a structured form. Implementation in Next.js is one extra tag per page.

The pattern

Define the JSON-LD object as a plain JS object in your page component. Render with <script type="application/ld+json" dangerouslySetInnerHTML={{__html: JSON.stringify(jsonLd)}} />. Place inside your page's JSX root.

Per-page-type structures

Different page types need different schemas. Home: Person or Organization. /services: Service. /blog/[slug]: Article. /contact: ContactPoint. Match the schema to the meaning.

Validate every time

Google's Rich Results Test or schema.org's validator. Paste the URL or the JSON. Fix anything red.

Want to Apply This to Your Business?

We're a Singapore AI development and automation agency. Let's discuss how we can help solve your specific challenges.