Back to Workshop resources
SEO · AEO · GEO1 min read
Meta tags for Next.js App Router — the Metadata API.
Per-page title, description, OG, Twitter. The Metadata API in two pages.
Overview
The Next.js Metadata API generates the right
<head> tags from a TypeScript export. It's the cleanest way to manage SEO across a multi-page site.Root layout sets defaults
Export a
metadata: Metadata from src/app/layout.tsx. Set metadataBase, default title with template, default description, default Open Graph image.Per-page overrides
Each page exports its own
metadata. The title template (%s — Your Site) merges with the page title automatically.Dynamic pages use generateMetadata
For dynamic routes (e.g. /blog/[slug]), export
async function generateMetadata({params}) that returns the Metadata object. Read the slug, look up the post, return the right tags.Related articles
Train your team on this
We teach teams to use Claude on their own work, and set up a company AI for them. Start with a free 1-hour preview, or see the full package.
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.