Crear un CMS de blog con Claude Code: Astro MDX, SEO multilingüe, QA y monetización

Un CMS de blog debe llevar al lector hasta una acción de negocio

Publicar más artículos no garantiza más ventas, formación contratada ni consultas. En muchos blogs técnicos el problema está en la operación: metadatos flojos, traducciones desalineadas, snippets sin probar, sitemap olvidado y CTA colocado al final como un anuncio genérico.

CMS significa Content Management System, sistema de gestión de contenidos. En este artículo no lo tratamos como un gran panel de administración, sino como un flujo repetible para guardar, revisar, previsualizar, publicar y distribuir artículos. Con Astro Content Collections y MDX se puede construir un CMS basado en archivos, suficientemente estricto para operaciones de contenido serias. Claude Code entra como asistente de edición, localización, QA y mejora de conversión.

Para ampliar el contexto, revisa Claude Code y Contentful CMS, auditoría de embudos de contenido, RSS con Claude Code y generación de sitemap. Las referencias oficiales son Astro Content Collections, Astro MDX integration y Astro Sitemap integration.

Divide el CMS en responsabilidades revisables

Pedir “haz un CMS de blog” es demasiado amplio. Para que Claude Code produzca cambios útiles, conviene separar schema, MDX, localización, vista previa, SEO, QA y monetización.

Área	Responsabilidad	Tarea adecuada para Claude Code
content schema	Definir campos y tipos del frontmatter	Implementar content.config.ts
artículos MDX	Gestionar texto, tablas, código y CTA	Reescribir borradores y añadir ejemplos
localización	Mantener el mismo slug en idiomas	Detectar archivos faltantes y adaptar tono
preview	Verificar la página antes de publicar	Ejecutar servidor local y revisar enlaces
SEO	Cuidar title, description, OGP y sitemap	Auditar metadatos y descripciones largas
QA gate	Bloquear errores antes del deploy	Crear scripts Node y checks enfocados
monetización	Conectar artículo con producto o consultoría	Revisar CTA y recorrido del lector

Tres casos reales de uso

El primer caso es un creador independiente que vende plantillas. Un tutorial de Claude Code puede terminar en una plantilla de proyecto, una biblioteca de prompts o una mini formación. Para eso el CMS necesita ctaLabel, ctaUrl, relatedPosts, updatedDate y heroImage, no solo el cuerpo del artículo.

El segundo caso es un blog técnico corporativo. Aquí el riesgo no es publicar poco, sino publicar algo convincente pero incorrecto: APIs antiguas, código que no compila, traducciones incompletas o una imagen OGP rota. Claude Code debe actuar como puerta de revisión antes de publicar.

El tercer caso es SEO multilingüe. Si trabajas en diez idiomas, el slug es el contrato. El título debe sonar natural en español, pero la tesis, los ejemplos y la intención del CTA deben coincidir con el resto de idiomas.

site/src/content/blog/claude-code-blog-cms.mdx
site/src/content/blog-en/claude-code-blog-cms.mdx
site/src/content/blog-zh/claude-code-blog-cms.mdx
site/src/content/blog-ko/claude-code-blog-cms.mdx
site/src/content/blog-es/claude-code-blog-cms.mdx
site/src/content/blog-fr/claude-code-blog-cms.mdx
site/src/content/blog-de/claude-code-blog-cms.mdx
site/src/content/blog-pt/claude-code-blog-cms.mdx
site/src/content/blog-hi/claude-code-blog-cms.mdx
site/src/content/blog-id/claude-code-blog-cms.mdx

Schema de Astro listo para copiar

Un schema es una regla explícita sobre los datos. Evita que un artículo sin fecha de actualización, sin imagen o con una descripción demasiado larga llegue a producción.

// src/content.config.ts
import { defineCollection, z } from "astro:content";
import { glob } from "astro/loaders";

const blogSchema = z.object({
  title: z.string().min(20).max(80),
  description: z.string().min(40).max(120),
  pubDate: z.coerce.date(),
  updatedDate: z.coerce.date(),
  category: z.enum(["getting-started", "tips-and-tricks", "use-cases", "comparison", "advanced"]),
  tags: z.array(z.string()).min(2).max(8),
  heroImage: z.string().startsWith("/images/"),
  draft: z.boolean().default(false),
  requireAllLocales: z.boolean().default(false),
  lang: z.enum(["ja", "en", "zh", "ko", "es", "fr", "de", "pt", "hi", "id"]),
  ctaLabel: z.string().max(40).optional(),
  ctaUrl: z.string().url().optional(),
});

const makeBlogCollection = (base: string) =>
  defineCollection({
    loader: glob({ pattern: "**/*.{md,mdx}", base }),
    schema: blogSchema,
  });

export const collections = {
  blog: makeBlogCollection("./src/content/blog"),
  "blog-en": makeBlogCollection("./src/content/blog-en"),
  "blog-zh": makeBlogCollection("./src/content/blog-zh"),
  "blog-ko": makeBlogCollection("./src/content/blog-ko"),
  "blog-es": makeBlogCollection("./src/content/blog-es"),
  "blog-fr": makeBlogCollection("./src/content/blog-fr"),
  "blog-de": makeBlogCollection("./src/content/blog-de"),
  "blog-pt": makeBlogCollection("./src/content/blog-pt"),
  "blog-hi": makeBlogCollection("./src/content/blog-hi"),
  "blog-id": makeBlogCollection("./src/content/blog-id"),
};

Frontmatter MDX con CTA

MDX es Markdown con capacidad de usar componentes. El frontmatter es la ficha técnica del artículo para listados, RSS, OGP, sitemap y CTA.

---
title: "Crear un CMS de blog con Claude Code: Astro MDX, SEO multilingüe, QA y monetización"
description: "Construye con Claude Code y Astro MDX un CMS de blog con schema, traducción, SEO, QA y CTA de ingresos."
pubDate: "2025-12-22"
updatedDate: "2026-06-02"
category: "use-cases"
tags: ["Claude Code", "CMS", "blog", "Astro", "MDX"]
heroImage: "/images/hero/hero-036.png"
lang: "es"
ctaLabel: "Reservar una consultoría de contenido con Claude Code"
ctaUrl: "https://example.com/consulting"
---

## Primera sección

Este artículo conecta redacción, localización, SEO, QA y CTA de monetización en un mismo flujo editorial.

Script Node de validación

Guárdalo como scripts/validate-blog-cms.mjs y ejecútalo con node scripts/validate-blog-cms.mjs claude-code-blog-cms.

// scripts/validate-blog-cms.mjs
import fs from "node:fs";
import path from "node:path";

const slug = process.argv[2];
if (!slug) {
  console.error("Usage: node scripts/validate-blog-cms.mjs <slug>");
  process.exit(1);
}

const locales = [["blog", "ja"], ["blog-en", "en"], ["blog-zh", "zh"], ["blog-ko", "ko"], ["blog-es", "es"], ["blog-fr", "fr"], ["blog-de", "de"], ["blog-pt", "pt"], ["blog-hi", "hi"], ["blog-id", "id"]];
const root = path.join(process.cwd(), "src", "content");
const failures = [];

function readFrontmatter(source) {
  const match = source.match(/^---\n([\s\S]*?)\n---/);
  if (!match) return {};
  return Object.fromEntries(match[1].split("\n").flatMap((line) => {
    const index = line.indexOf(":");
    if (index === -1) return [];
    return [[line.slice(0, index).trim(), line.slice(index + 1).trim().replace(/^"|"$/g, "")]];
  }));
}

for (const [dir, lang] of locales) {
  const file = path.join(root, dir, `${slug}.mdx`);
  const source = fs.existsSync(file) ? fs.readFileSync(file, "utf8") : "";
  const data = readFrontmatter(source);
  if (!source) failures.push(`${dir}: missing file`);
  if (data.lang !== lang) failures.push(`${dir}: wrong lang`);
  if (!data.updatedDate) failures.push(`${dir}: missing updatedDate`);
  if ((data.description || "").length > 120) failures.push(`${dir}: description too long`);
  if (!/https:\/\/docs\.astro\.build/.test(source)) failures.push(`${dir}: missing official docs`);
  if (!/\]\(\/blog\/claude-code-/.test(source)) failures.push(`${dir}: missing internal link`);
  if (!/(CTA|consultoría|consult|training)/i.test(source)) failures.push(`${dir}: missing CTA`);
  if ((source.match(/`{3}/g) || []).length < 6) failures.push(`${dir}: fewer than three code blocks`);
}

if (failures.length) {
  console.error(failures.map((item) => `- ${item}`).join("\n"));
  process.exit(1);
}
console.log(`OK: ${slug} passed localized CMS checks.`);

Prompt de borrador a publicación

Rewrite the article for slug <slug> as a production-ready Astro MDX blog post.
- Edit only the localized files for this slug.
- Keep heroImage and category.
- Add updatedDate: "2026-06-02".
- Keep description within 120 characters.
- Include 3 real use cases, concrete pitfalls, runnable code, official Astro docs, internal links, and a monetization CTA.
- Report changed files and focused check results.

Errores frecuentes y resultado probado

Los fallos más comunes son actualizar un solo idioma, dar a Claude Code permiso para tocar demasiados archivos, publicar código que no se puede copiar y ejecutar, olvidar RSS/sitemap/OGP o usar un CTA demasiado agresivo. Un buen flujo ofrece primero una checklist, luego una plantilla, después formación y finalmente consultoría.

Probé este flujo en un proyecto Astro pequeño. El schema bloqueó fechas faltantes y el script detectó descriptions largas, ausencia de documentación oficial, enlaces internos faltantes y CTA omitidos. La automatización no puede juzgar por completo la naturalidad del español ni la fuerza comercial de la oferta, así que la revisión humana sigue siendo obligatoria antes de publicar.