Hecho con Chinaski

Open Graph

Las etiquetas Open Graph hacen que tus páginas se rendericen bien cuando alguien las comparte en Facebook, X, LinkedIn, Slack y servicios similares. Chinaski escribe todas las etiquetas Open Graph y las Twitter (X) correspondientes por ti cuando construye tu site.

Lo que Chinaski etiqueta automáticamente

Cada página y post en la salida estática lleva:

  • og:title: tu título OG, con fallback a tu meta title, luego al título de la página
  • og:description: tu descripción OG, con fallback a tu meta description, luego a la tagline del site
  • og:image: la URL de tu imagen OG, con fallback a la imagen destacada, luego a la imagen de compartir por defecto
  • og:type: article para posts de blog, website para todo lo demás (pages, la homepage y las páginas de listado)
  • og:locale: el código de idioma de la página (p. ej. en)
  • og:url y og:site_name : solo cuando hay una URL canónica y el site tiene nombre

Las etiquetas sin valor se omiten por completo. Nada emite vacío. Las etiquetas Twitter equivalentes (title, description, image) se emiten junto a ellas, usando una tarjeta de imagen grande cuando hay imagen de compartir y una tarjeta de resumen en caso contrario, y twitter:site se establece a partir del handle de X/Twitter en la pestaña de Integrations de los settings.

Establecer campos OG por página o post

El editor de cada página y post tiene tres campos: OG Title, OG Description y OG Image URL.

  • Deja OG Title en blanco para heredar el Meta Title (o el título de la página/post).
  • Deja OG Description en blanco para heredar la Meta Description.
  • OG Image URL acepta cualquier URL de imagen.

Todo surte efecto tras el siguiente build del site.

Cachear una imagen de fallback: imagen de compartir por defecto

En lugar de establecer una imagen OG en cada elemento, elige un fallback para todo el site en Settings → General: el ajuste Default Site Image. Se usa como imagen de compartir en cualquier página o post sin imagen OG y sin imagen destacada. Déjalo en blanco para omitir el fallback.

Manejo de URLs de imágenes

Si estableces una imagen OG (o la imagen de compartir por defecto) con una ruta relativa a la raíz de tu site, una que empieza con / : Chinaski la resuelve contra tu ajuste de Site URL durante el build, así las plataformas sociales ven una URL completa. Las URLs absolutas (como https://…) y los valores sin una Site URL configurada pasan sin cambios.

Plantillas de temas

Si construyes temas tú mismo, el contexto de plantilla incluye og_title, og_description, og_image_url y la imagen de site por defecto (tanto relativa como absoluta), así que el marcado personalizado puede reutilizar los mismos valores. Incluir el snippet compartido de meta-tags en tu tema mantiene la salida de Open Graph consistente con el site de fábrica.

Lee este sitio en