building-blog

Implements an SEO-optimized blog section on Next.js sites backed by Sanity CMS.

30.5k|3.5k|Updated Jul 4, 2025
One-click install
npx skills add https://github.com/davila7/claude-code-templates --skill building-blog
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: building-blog
Source: https://github.com/davila7/claude-code-templates/tree/main/cli-tool/components/skills/web-development/building-blog
Command: npx skills add https://github.com/davila7/claude-code-templates --skill building-blog

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Adding a blog to an existing Next.js site involves dozens of interlocking decisions—content modeling, i18n routing, hreflang, structured data, performance budgets, and editorial workflows—that are easy to get wrong and costly to rework. This Skill provides a complete, opinionated specification and guided workflow for shipping a corporate blog on Next.js + Sanity without missing critical SEO or accessibility requirements.

Core Features & Use Cases

  • Guided intake questionnaire: A 40-question intake (§0) scans the host project first, pre-fills detected values, and produces a Project Profile that drives the entire implementation.
  • Universal technical spec: Sections §2–§20 cover the Sanity content model, URL structure, i18n fallback handling, JSON-LD structured data, sitemaps, Atom feeds, Core Web Vitals budgets, and accessibility—usable across projects without editing.
  • AI hero image style guide: A reusable template for generating on-brand blog hero images with Gemini image models, including palette rules, composition constraints, and prompt templates.
  • Use Case: A developer asked to "add a blog" to a multilingual Next.js marketing site runs the intake, gets an approved phased plan, then implements schema, routes, SEO surface, and hero images against the pass/fail checklist.

Quick Start

Ask the AI to add a blog to your Next.js site using Sanity CMS and let it scan the project, run the intake questionnaire, and produce an implementation plan for approval.

Frequently Asked Questions about building-blog

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

FAQPage Schema
How do I add a blog to a Next.js site with Sanity CMS?

Run the skill's intake questionnaire after it scans your project for Next.js version, i18n setup, and existing Sanity configuration. It produces a Project Profile and phased plan covering schema, routes, SEO surface, and performance, then implements against the spec sections §2–§20.

How should hreflang work for a multilingual Next.js blog?

Listing pages emit the full hreflang set across all locales plus x-default, while independent posts emit no post-level hreflang since there is no translation graph. Locale prefixes are always present in URLs to avoid duplicate-content risk between the root and primary locale.

Does this blog setup support AI-generated hero images?

Yes, an optional style guide drives hero image generation with Gemini image models using brand palettes, composition rules, and prompt templates. Generated images are uploaded to Sanity with localized alt text, and re-runs are idempotent per post.

When should I not use this Next.js Sanity blog approach?

Skip it for static MDX-only blogs without a CMS, high-velocity news publishers needing sitemap chunking, documentation sites better served by docs frameworks, and marketing landing pages that are not really blogs.

What structured data does a blog article page need for SEO?

Each article emits BlogPosting JSON-LD with headline, image, dates, author, and publisher logo, plus a BreadcrumbList block, and FAQPage only when the post contains an FAQ block. Canonical URLs are self-referencing per locale and never cross-canonicalized.