Add og:image preview cards to docs pages

Abierto
#237 1 comentario 0 reacciones 0 asignados Ver en GitHub

@adamshatzkamer ya está trabajando en esto.

Desde el 9/10/2026.

  • #242 de @adamshatzkamer — abierto

Evaluación

Dificultad
3/5
Tiempo estimado
1-2 días
Aptitud para principiantes
66/100
Tipo de issue
Nueva funcionalidad
Claridad
Bastante claro
Estado de actividad
Activo
Stack tecnológico
javascript, react

Línea de trabajo

Start by locating how the website renders docs pages and sets their page metadata, then identify the existing title and description handling. Add and verify the requested Open Graph and Twitter card metadata, including an image with alt text and 1200x630 dimensions. Check a docs URL with the LinkedIn Post Inspector and X/Twitter card validator; per-page image generation is optional.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

Summary

Docs pages have no og:image, so links shared on LinkedIn, X or Slack show no preview card.

Current behavior

Sharing a docs URL produces a plain link with no image.

Expected behavior

Shared docs links show a preview card with an image, title and description.

Proposed solution

  • Add a default og:image (branded, 1200x630) to all docs pages.
  • Optionally generate per-page images from the page title.
  • Add twitter:card (summary_large_image), og:image:width, og:image:height and og:image:alt.

Acceptance criteria

  • A docs page URL shows a preview card in the LinkedIn Post Inspector and the X/Twitter card validator.
  • Image has alt text and correct dimensions.

Additional context

Found in an audit of gofr.dev AI readiness and discoverability on 2026-10-07.

Lenguaje dominante
JavaScript
Estrellas
44
Forks
44
Métricas de merge de PR
Sin PR fusionados en 30 d

Preparar el entorno

  • Incluye un Dockerfile o un archivo de Docker Compose
  • Sin plantilla de pull request
  • Sin guía de contribución

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de gofr-dev/website

Todos los issues de gofr-dev/website

Issues similares

Más issues de JavaScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.