nextjs-seo

Implement metadata, Open Graph, Twitter Cards, JSON-LD, sitemaps, and robots.txt for Next.js 13+ App Router.

2|Updated Dec 6, 2025
One-click install
npx skills add https://github.com/Ali1raz/portal-cui --skill nextjs-seo-ali1raz
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: nextjs-seo
Source: https://github.com/Ali1raz/portal-cui/tree/main/.github/skills/nextjs-seo
Command: npx skills add https://github.com/Ali1raz/portal-cui --skill nextjs-seo-ali1raz

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires next, react, react-helmet, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill addresses the challenge of enhancing SEO for Next.js projects, providing tools for metadata management, social sharing, and structured data integration.

Core Features & Use Cases

  • SEO Optimization: Offers a comprehensive set of features to optimize the SEO of a Next.js app, including metadata API, Open Graph tags, Twitter Cards, and JSON-LD structured data.
  • Dynamic Routes: Handles dynamic routes in Next.js, allowing for SEO-friendly URLs and metadata generation.
  • Use Case: For a Next.js e-commerce site, this Skill can be used to add rich snippets for product pages, improving search engine visibility and click-through rates.

Quick Start

Run the nextjs-seo skill to enhance the SEO of your Next.js project.

Frequently Asked Questions about nextjs-seo

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

FAQPage Schema
How do I add Open Graph tags and JSON-LD structured data to a Next.js app?

You can add Open Graph tags and JSON-LD structured data to a Next.js app by implementing metadata management and structured data integration tailored for the Next.js 13+ App Router to enable rich snippets and social sharing.

What is the best way to generate dynamic metadata for Next.js routes?

Generating dynamic metadata for Next.js routes is handled by implementing dynamic route support to create SEO-friendly URLs and metadata generation. This allows each route to have unique, dynamically generated SEO properties.

Does this SEO optimization approach work with Next.js 13 App Router?

Yes, this SEO optimization approach works with Next.js 13+ App Router. It is specifically tailored for this architecture to manage metadata, sitemaps, and robots.txt configurations effectively.

How do I configure sitemaps and robots.txt in a Next.js project?

You can configure sitemaps and robots.txt in a Next.js project through comprehensive SEO optimization features. This involves generating the necessary configuration files to improve search engine visibility and crawling.

Do I need React Helmet to manage metadata in Next.js?

Yes, React Helmet is listed as a dependency alongside Next.js and React. It is utilized to manage and implement the metadata, Open Graph tags, and Twitter Cards required for SEO optimization.