Cómo utilizar JSON-LD para el esquema de blog en Framer CMS

Blog

Si has pasado algún tiempo trabajando con el CMS de Framer, sabrás lo limpio e intuitivo que se siente. Pero en el momento en que añades datos estructurados, las cosas se vuelven un poco delicadas.

JSON-LD no perdona. Una coma que falta, un carácter sin escapar, o una variable mal colocada, y Google silenciosamente descarta todo tu esquema.

Pasé por esto personalmente mientras configuraba el esquema para mi blog. La experiencia fue una mezcla de pequeñas victorias, fracasos silenciosos y un par de momentos de "¿por qué Google sigue gritándome?". Esta guía resume todo lo que aprendí, con pasos prácticos que puedes seguir, ya sea que estés empezando tu blog o mejorando uno existente.

Por qué los Datos Estructurados Realmente Importan

Los datos estructurados, o esquema, ofrecen a los motores de búsqueda una comprensión más clara de tu contenido. No es magia, y no se trata de engañar a Google. Es simplemente metadata que describe lo que contiene tu página.

Para las publicaciones de blog, el esquema puede resaltar:

  • el título del artículo

  • el autor

  • la fecha de publicación

  • la imagen destacada

  • la URL del artículo

  • y el tipo general de contenido

Google interpreta todo esto para crear listados de búsqueda más ricos y categorizar mejor tu sitio web.

Aunque tu sitio puede vivir sin esquema, añadirlo aporta consistencia. Es especialmente útil cuando escribes con frecuencia, porque asegura que cada artículo comunica la misma estructura internamente.

Dónde Coloca Framer el Esquema

Framer te ofrece dos puntos de entrada diferentes para añadir datos estructurados. Ambos funcionan, pero están diseñados para diferentes niveles de control.

1. SEO → Datos Estructurados (Panel Visual)

Esta es la interfaz integrada, basada en campos, donde puedes mapear cada propiedad manualmente.

Es ideal para configuraciones simples, especialmente si prefieres no tocar código.

Pero rápidamente se vuelve limitante en el momento en que necesitas objetos anidados como:

"author": {
"@type": "Person",
"name": "Your Name",
"url": "Your Profile"
}

Para algo más allá de lo básico, querrás la segunda opción.

2. Código Personalizado → Head (Control Total)

Aquí es donde puedes pegar un script JSON-LD completo y extraer valores del CMS usando la notación de Framer:

{{FieldName | json}}

Esta es la forma más segura de insertar valores dinámicos, porque | json escapa el contenido correctamente.

Si lo omites, y tu título o descripción contiene comillas, saltos de línea o símbolos, tu esquema se rompe silenciosamente.

Esto me ocurrió con una descripción que incluía una cita. Todo parecía normal en Framer, pero Google no reconoció el esquema hasta que usé el filtro | json.

La Plantilla de Esquema Que Finalmente Funcionó

Tras probar diferentes patrones y corregir algunos errores silenciosos, este es el bloque exacto de JSON-LD que uso para mis artículos:

<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "BlogPosting",
"headline": {{Title | json}},
"description": {{Description | json}},
"image": {{Image | json}},
"datePublished": {{Date | json}},
"dateModified": {{Date | json}},
"author": {
"@type": "Person",
"name": "Josué Somarribas",
"url": "https://www.linkedin.com/in/josuesb/"
},
"url": "https://josuesomarribas.com/blog/{{Slug}}"
}
</script>

Algunas cosas a tener en cuenta:

  • El @type es BlogPosting, que es más específico que “Artículo”.

  • Todos los campos del CMS pasan por el filtro JSON.

  • El autor tiene tanto un nombre como una URL, lo que elimina una de las advertencias de Google de “opcional pero recomendado”.

  • La URL final utiliza el slug del artículo, por lo que todo se mantiene dinámico.

Esta configuración mantiene las cosas predecibles y fáciles de mantener, incluso si tu blog crece a docenas de publicaciones.

Problemas Comunes (y Cómo los Solucioné)

1. Comas Faltantes

Un pequeño error, pero que rompe todo.

JSON-LD es esencialmente un objeto JavaScript. Si olvidas una coma después de un campo, todo el esquema se vuelve inválido.

Me faltó una justo después de "name": "Josué Somarribas". Google rechazó el esquema hasta que lo corregí.

2. Falta el | json

Framer insertará los valores del CMS sin filtrarlos, pero eso es arriesgado.

Cualquier carácter inusual puede cerrar una cadena prematuramente e invalidar el resto del script.

Este filtro es tu red de seguridad:

{{Title | json}}

3. No Coincidir con la Estructura Real de la URL

Si tu blog vive en:

https://yourdomain.com/blog/post-name

Tu esquema debe reflejar eso exactamente.

Un desajuste entre la URL del esquema y la URL publicada real no romperá el esquema, pero Google lo considera engañoso y puede ignorar el campo.

4. Probar la Vista Previa en Lugar de la Versión en Vivo

El modo de vista previa de Framer no inyecta todos tus datos estructurados.

Google solo detectará el esquema en la versión publicada de la página.

Así que siempre prueba usando tu URL en vivo.

5. Ignorar los Campos “opcional pero recomendado” de Google

Google a menudo señala campos opcionales faltantes como "url" dentro del bloque del autor o detalles del "publisher". Estos no son errores, pero mejoran la calidad y completitud de tus datos estructurados.

En la práctica, añadir campos como:

"author": {
"@type": "Person",
"name": "Josué Somarribas",
"url": "https://www.linkedin.com/in/josuesb/"
}

reduce advertencias y le da a Google una comprensión más completa del contenido. Vale la pena completarlos siempre que sea posible.

Cómo Validar Tu Esquema

Una vez que tu script esté en su lugar, usa estas dos herramientas:

Prueba de Resultados Enriquecidos de Google

https://search.google.com/test/rich-results

Esto te dice si Google entiende tu esquema y si es elegible para resultados enriquecidos.

Validador de Schema.org

https://validator.schema.org

Este es más estricto con la sintaxis y es excelente para detectar problemas de formato.

Ejecuta ambos y confirma:

  • sin errores críticos

  • sin JSON roto

  • sin comas faltantes

  • fechas correctamente formateadas

  • URL de la imagen es válida

  • el bloque del autor es reconocido

Si ambas herramientas confirman tu marcado, has terminado.

Dónde Aprender Más Acerca de los Datos Estructurados (Guía Oficial de Google)

Si deseas profundizar más allá del marcado básico de BlogPosting, Google mantiene un excelente catálogo, constantemente actualizado, de todas las características de datos estructurados que soportan. Se llama Galería de Búsqueda, y es lo más parecido a una “lista maestra” de tipos de esquema que puedes implementar.

Puedes acceder a ella aquí:

https://developers.google.com/search/docs/appearance/structured-data/search-gallery

La galería descompone cada categoría de esquema soportada con ejemplos visuales, campos requeridos, mejoras opcionales y notas de implementación. Cubre desde el marcado de artículos simples hasta tipos más específicos como:

  • Migas de pan

  • FAQs

  • Cursos

  • Recetas

  • Eventos

  • Guías de

JOSUÉ SB

Crear soluciones digitales que realmente tienen sentido

2025 - Todos los derechos reservados

JOSUÉ SB

Crear soluciones digitales que realmente tienen sentido

2025 - Todos los derechos reservados

JOSUÉ SB

Crear soluciones digitales que realmente tienen sentido

2025 - Todos los derechos reservados