Skip to main content

Arquitectura: Sistema Multiblog y Frontmatter

Filosofía de Diseño

Principios Fundamentales

  1. El frontmatter es la verdad: Las carpetas solo sirven para organización interna. El tipo, clasificación y metadatos de cualquier contenido se definen exclusivamente en el frontmatter.
  2. Flexibilidad total: Un mismo contenido puede pertenecer a múltiples categorías (categories como array), aparecer en varios “blogs” o secciones simultáneamente.
  3. Consistencia con el tema base: Mantenemos compatibilidad con el tema de David V. Kimball, ampliándolo con nuevos campos sin romper funcionalidades existentes.
  4. Estándares de la industria: Usamos formatos ISO 8601 para fechas, arrays para autores y categorías, y nombres de campos semánticos y claros.

Carpetas vs. Frontmatter

  • Carpetas (posts/, docs/, projects/, pages/, special/): Solo organización física de archivos.
  • Frontmatter (type: post, categories: [biodanza], etc.): Define la naturaleza, clasificación y comportamiento del contenido.

Frontmatter Estándar (Núcleo Común)

Estos campos son válidos para todos los tipos de contenido:

title: 'Título del Contenido'
slug: slug-del-contenido
description: Descripción breve para SEO y tarjetas.
type: post | doc | project | page | special
lang: es-ES
draft: false
aliases:
  - antigua-url
noIndex: false
hideTOC: false
showTOC: false
hideCoverImage: false

Descripción de campos:

  • title: Título principal del contenido.
  • slug: URL amigable. Si no existe, se genera desde el título.
  • description: Descripción para SEO, meta tags y tarjetas sociales.
  • type: Tipo de contenido. Determina qué campos adicionales son válidos.
  • lang: Idioma del contenido (formato BCP 47: es-ES, en-US, etc.).
  • draft: Si es true, el contenido no se publica. Si es false, se publica.
  • aliases: Array de URLs antiguas que redirigen a este contenido (para SEO y compatibilidad).
  • noIndex: Si es true, el contenido no se indexa en buscadores.
  • hideTOC: Si es true, oculta la tabla de contenidos.
  • showTOC: Si es true, fuerza la muestra de la tabla de contenidos.
  • hideCoverImage: Si es true, oculta la imagen de portada (útil si la imagen ya está en el cuerpo del texto).

Extensiones por Tipo de Contenido

1. POSTS (Artículos del Blog)

---
title: 'La respiración: Mecánica biológica y control consciente'
slug: la-respiracion-mecanica-biologica-y-control-consciente
description: Análisis de la respiración como proceso fisiológico fundamental.
type: post
lang: es-ES
draft: false

# Autores (array para soportar co-autoría)
authors:
  - 'Ernesto Uriszar'

# Fechas (ISO 8601 completo)
pubDate: 2026-06-01T10:21:00.000Z
updatedDate: 2026-06-01T10:21:00.000Z

# Clasificación (array para multiblog)
categories:
  - biodanza
  - bienestar
tags:
  - respiracion
  - fisiologia
  - sistema-nervioso

# Visibilidad y Control
featured: false
allowComments: true
share: true

# Imagen de portada
image: '/articulos/la_respiracion.webp'
imageAlt: 'Representación gráfica de la caja torácica.'

# SEO
canonicalUrl: null

# Control de visualización
aliases:
  - respiracion
noIndex: false
hideTOC: false
showTOC: false
hideCoverImage: false
---

Campos específicos de posts:

  • authors: Array de nombres de autores. Soporta co-autoría.
  • pubDate: Fecha de publicación (ISO 8601).
  • updatedDate: Fecha de última modificación (ISO 8601).
  • categories: Array de categorías. Un post puede pertenecer a múltiples “blogs” o secciones.
  • tags: Array de etiquetas para clasificación transversal.
  • featured: Si es true, el post se destaca en la portada.
  • allowComments: Si es true, se muestran los controles de comentarios (preparado para integración futura).
  • share: Si es true, se muestran los botones de compartir en redes sociales.
  • image: Ruta a la imagen de portada (puede ser ruta absoluta /ruta.webp o sintaxis Obsidian [[imagen.png]]).
  • imageAlt: Texto alternativo para la imagen (accesibilidad y SEO).
  • canonicalUrl: URL canónica externa (si el contenido se publicó primero en otro sitio). null si no aplica.

2. DOCS (Documentación)

---
title: 'Configuración de SourceTree y Git'
slug: sourcetree-and-git-setup
description: Guía completa para configurar SourceTree y Git.
type: doc
lang: es-ES
draft: false

# Autores
authors:
  - 'Ernesto Uriszar'

# Fechas
pubDate: 2024-01-15T00:00:00.000Z
updatedDate: 2024-01-15T00:00:00.000Z

# Clasificación (array)
categories:
  - software-opcional
  - git

# Orden y versión (específicos de docs)
order: 2
version: '1.0.0'

# Imagen
image: '[[sourcetree.png]]'
imageAlt: 'Logo de SourceTree con fondo azul.'

# Control de visualización
hideTOC: false
showTOC: false
hideCoverImage: false
noIndex: false
aliases:
  - sourcetree-and-git
---

Campos específicos de docs:

  • order: Número para ordenar en la barra lateral de documentación.
  • version: Versión del documento (ej: '1.0.0').
  • categories: Array de categorías. La primera categoría se usa para agrupar en la barra lateral.

3. PROJECTS (Proyectos)

---
title: 'Astro Composer'
slug: astro-composer
description: Herramienta para componer sitios Astro modulares.
type: project
lang: es-ES
draft: false

# Autores
authors:
  - 'Ernesto Uriszar'

# Fechas
pubDate: 2026-01-01T00:00:00.000Z
updatedDate: 2026-06-01T00:00:00.000Z

# Clasificación
categories:
  - astro
  - open-source

# URLs del proyecto
repositoryUrl: 'https://github.com/uriszarernesto-blip/astro-composer'
projectUrl: 'https://astro-composer.pages.dev'
demoUrl: 'https://demo.astro-composer.pages.dev'
status: 'Activo'

# Visibilidad
featured: true

# Imagen
image: '/projects/astro-composer.webp'
imageAlt: 'Captura de pantalla de Astro Composer.'

# Control
hideTOC: false
showTOC: false
hideCoverImage: false
noIndex: false
---

Campos específicos de projects:

  • repositoryUrl: URL del repositorio de código (GitHub, GitLab, etc.).
  • projectUrl: URL del proyecto en producción.
  • demoUrl: URL de una demo en vivo.
  • status: Estado del proyecto (ej: 'Activo', 'Archivado', 'En desarrollo').
  • featured: Si es true, el proyecto se destaca en la página de proyectos.

4. PAGES (Páginas Estáticas)

---
title: 'Acerca de'
slug: about
description: Conoce más sobre Astro Modular.
type: page
lang: es-ES
draft: false

# Imagen (opcional para pages)
image: null
imageAlt: null

# Control
hideTOC: false
showTOC: false
hideCoverImage: false
noIndex: false
aliases:
  - about-me
  - about-us
---

Notas sobre pages:

  • Las páginas estáticas (Acerca de, Contacto, Política de Privacidad) no necesitan fechas, autores ni categorías.
  • Solo usan el núcleo común + imagen opcional + control de visualización.

5. SPECIAL (Páginas Especiales)

---
title: 'Inicio'
description: Página principal del sitio.
type: special
lang: es-ES
hideTOC: true
---

Notas sobre special:

  • Páginas con lógica especial (home, 404, índices de secciones).
  • Solo necesitan el mínimo: title, description, type, lang, hideTOC.

Reglas de Conversión (Migración)

Al migrar contenido antiguo, se aplican estas transformaciones automáticas:

Campo AntiguoCampo NuevoTransformación
datepubDateRenombrar y convertir a ISO 8601
lastModifiedupdatedDateRenombrar y convertir a ISO 8601
authorauthorsConvertir string a array: 'Ernesto'['Ernesto']
subtypecategoriesConvertir string a array: 'Biodanza'['biodanza']
published: truedraft: falseInvertir lógica booleana
url: nulocanonicalUrl: nullRenombrar y convertir 'nulo' a null
heroImageimageRenombrar (mantener ruta exacta)
heroImageAltimageAltRenombrar
id(eliminar)Redundante con el nombre del archivo
readingTime(eliminar)Calculado automáticamente por Astro
category (singular)categories (array)Convertir a array

Formato de Fechas

Estándar: ISO 8601 completo con zona horaria UTC.

Ejemplo: 2026-06-01T10:21:00.000Z

Componentes:

  • 2026-06-01: Fecha (YYYY-MM-DD)
  • T: Separador
  • 10:21:00: Hora (HH:MM:SS)
  • .000: Milisegundos
  • Z: Zona horaria UTC

Conversión automática:

  • Si el campo antiguo es 2024-01-15 (solo fecha), se convierte a 2024-01-15T00:00:00.000Z.
  • Si el campo antiguo es 2024-01-15T10:30:00 (sin zona), se asume UTC y se añade Z.

Imágenes: Sintaxis Soportadas

El sistema acepta dos formatos de ruta en el campo image:

1. Ruta Absoluta (Recomendado)

image: '/articulos/la_respiracion.webp'
  • Ruta desde la carpeta public/.
  • Astro optimiza automáticamente la imagen.
  • Recomendado para producción.
image: '[[sourcetree.png]]'
  • Sintaxis nativa de Obsidian.
  • El tema busca la imagen en la bóveda y la copia a public/.
  • Útil durante la edición en Obsidian.

Nota: Ambos formatos son válidos. El tema los procesa automáticamente.


Próximos Pasos de Implementación

  1. Documentación (este archivo): Definir la arquitectura completa.
  2. Actualizar src/content.config.ts: Validar el nuevo schema con todos los campos.
  3. Script de migración: Convertir automáticamente todos los archivos .md existentes al nuevo formato.
  4. Adaptar componentes: Modificar PostCard.astro, DocsSidebar.astro, etc., para leer los nuevos campos (authors, categories, pubDate, etc.).
  5. Crear páginas dinámicas: Implementar /blog/[categoria] para listar posts por categoría.

Ejemplos Completos por Tipo

Ejemplo 1: Post de Blog

---
title: 'Introducción a la Biodanza'
slug: introduccion-biodanza
description: Descubre los principios fundamentales de la Biodanza.
type: post
lang: es-ES
draft: false
authors:
  - 'Ernesto Uriszar'
pubDate: 2026-06-01T10:00:00.000Z
updatedDate: 2026-06-05T14:30:00.000Z
categories:
  - biodanza
  - bienestar
tags:
  - introduccion
  - principios
featured: false
allowComments: true
share: true
image: '/articulos/biodanza.webp'
imageAlt: 'Personas bailando en círculo.'
canonicalUrl: null
hideTOC: false
showTOC: false
hideCoverImage: false
noIndex: false
---

Ejemplo 2: Documentación Técnica

---
title: 'Instalación de Obsidian'
slug: installing-obsidian
description: Guía paso a paso para instalar Obsidian en tu sistema.
type: doc
lang: es-ES
draft: false
authors:
  - 'Ernesto Uriszar'
pubDate: 2024-01-10T00:00:00.000Z
updatedDate: 2024-01-15T00:00:00.000Z
categories:
  - instalacion
  - obsidian
order: 1
version: '1.0.0'
image: '[[obsidian-logo.png]]'
imageAlt: 'Logo de Obsidian.'
hideTOC: false
showTOC: false
hideCoverImage: false
noIndex: false
---

Ejemplo 3: Proyecto

---
title: 'Vault CMS'
slug: vault-cms
description: Convierte tu bóveda de Obsidian en un CMS para blogs.
type: project
lang: es-ES
draft: false
authors:
  - 'Ernesto Uriszar'
pubDate: 2026-01-01T00:00:00.000Z
updatedDate: 2026-06-01T00:00:00.000Z
categories:
  - astro
  - cms
repositoryUrl: 'https://github.com/uriszarernesto-blip/vault-cms'
projectUrl: 'https://vault-cms.pages.dev'
demoUrl: ''
status: 'Activo'
featured: true
image: '/projects/vault-cms.webp'
imageAlt: 'Captura de Vault CMS.'
hideTOC: false
showTOC: false
hideCoverImage: false
noIndex: false
---

Resumen de Campos por Tipo

Campopostdocprojectpagespecial
title
slug
description
type
lang
draft
authors
pubDate
updatedDate
categories
tags
featured
allowComments
share
image
imageAlt
canonicalUrl
order
version
repositoryUrl
projectUrl
demoUrl
status
aliases
noIndex
hideTOC
showTOC
hideCoverImage

Conclusión

Este sistema de frontmatter proporciona:

  • Máxima flexibilidad: Un contenido puede aparecer en múltiples lugares sin duplicación.
  • Compatibilidad total: Respeta el tema base y el flujo de trabajo con Obsidian.
  • Escalabilidad: Fácil de ampliar con nuevos campos en el futuro.
  • Claridad: Cada campo tiene un propósito específico y bien documentado.

El siguiente paso es actualizar src/content.config.ts para validar este schema y luego crear el script de migración.