seo-metadata

Generate Next.js Metadata API configurations with Open Graph and JSON-LD schemas.

6|Updated Jan 29, 2026

Search Tags:#SEO #Next.js #JSON-LD #Open Graph #Portfolio #Structured Data

Ready to run

npx skills add https://github.com/JaivishChauhan/vibecoding-starter --skill seo-metadata

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: seo-metadata
Source: https://github.com/JaivishChauhan/vibecoding-starter/tree/main/.agent/skills/seo-metadata
Command: npx skills add https://github.com/JaivishChauhan/vibecoding-starter --skill seo-metadata

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps portfolio sites improve search visibility and social previews by providing structured SEO configuration using Next.js Metadata API, Open Graph, and JSON-LD.

Core Features & Use Cases

Global defaults: define site-wide metadataBase, openGraph, twitter, and website schema.
Page-level control: generate dynamic metadata for projects and blog posts.
Structured data: add Person, CreativeWork, and Breadcrumb schemas to enhance search results.

Quick Start

Set up a Next.js app and implement a global metadata configuration in app/layout.tsx, plus per-page metadata generation for projects and blog posts to drive Open Graph, Twitter, and JSON-LD schemas.

Frequently Asked Questions about seo-metadata

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I generate Next.js metadata API configurations for a portfolio site?▼

Generate Next.js metadata API configurations by defining global site-wide defaults in app/layout.tsx and dynamic page-level metadata for projects and blog posts to drive consistent SEO across your portfolio.

What is JSON-LD structured data and when do I need it for SEO?▼

JSON-LD structured data is a schema format that helps search engines understand your content. You need it for portfolio SEO to add Person, CreativeWork, and Breadcrumb schemas that enhance search result appearances.

How do I set up Open Graph and Twitter metadata for Next.js project pages?▼

Set up Open Graph and Twitter metadata for Next.js project pages by implementing dynamic metadata generation, ensuring consistent social previews and structured data across personal portfolio and project pages.

Can I define site-wide SEO defaults and still control metadata for individual blog posts?▼

Yes, you can define site-wide SEO defaults like metadataBase and website schema globally, while using the Next.js Metadata API to generate dynamic, page-level metadata for individual blog posts and projects.

Does this approach to SEO metadata work for personal portfolios built with Next.js?▼

Yes, this SEO metadata approach works for personal portfolios built with Next.js by providing global and page-level metadata, Open Graph, Twitter, and JSON-LD schema configurations tailored for portfolio discoverability.

What's the best way to add Breadcrumb and Person schema to a Next.js blog?▼

The best way to add Breadcrumb and Person schema to a Next.js blog is by generating JSON-LD structured data configurations, which enhance search results and improve content discoverability for personal portfolios.