Skip to content

Add Open Graph + Twitter Card social preview (og:image) - #743

Open
Astra Intelligence Labs (astra-intelligence) wants to merge 1 commit into
devcontainers:gh-pagesfrom
astra-intelligence:add-social-preview
Open

Astra Intelligence Labs (astra-intelligence) wants to merge 1 commit into
devcontainers:gh-pagesfrom
astra-intelligence:add-social-preview

Conversation

@astra-intelligence

What

This PR adds a 1200×630 social preview image and full og: / twitter: meta tags to the site's shared head include (_includes/head.html).

Today, links to devcontainers.github.io — including the spec page, feature collections, and template listings — render with a blank card when shared on GitHub, Slack, X/Twitter, and chat apps. After this change they show a proper branded preview.

What's included

  • img/social-preview.png — 1200×630 card using the project's real logo and theme color (#2753E3) on white, with the site title and tagline
  • _includes/head.html — og:title, og:description, og:type, og:url, og:image (+ width/height/alt), twitter:card=summary_large_image, twitter:title, twitter:description, twitter:image
  • tools/make-social-preview.py — portable Pillow generator so the preview can be regenerated/updated without design tooling

All image URLs are absolute, so crawlers and chat apps resolve them regardless of how the page is served. The tags are added to the shared include, so every page on the site gets the preview, not just the homepage.

Preview

social-preview.png

Adds a 1200x630 social preview image (img/social-preview.png) and full
og:/twitter: meta tags to the shared head include, so shared links to
devcontainers.github.io render a proper preview card on GitHub, Slack,
Twitter/X, and chat apps.

- og:title / og:description / og:image with absolute URL + dimensions
- twitter:card summary_large_image
- Portable generator at tools/make-social-preview.py for regeneration

Co-Authored-By: Paperclip <noreply@paperclip.ing>
@astra-intelligence

Copy link
Copy Markdown
Author

@microsoft-github-policy-service agree

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant