layer5io / layer5io/recognition

[Feature] Add meta social preview image and Open Graph / Twitter tags for badges.layer5.io

Open
#111 4 comments 0 reactions 1 assignee View on GitHub

@akkki007 is already working on this.

Since Sep 10, 2026.

good first issue kind/bug
Dominant language
JavaScript
Stars
23
Forks
15
Avg merge
3h 18m
Merged PRs (30d)
3

Description

Current Behavior

When sharing links to https://badges.layer5.io on social media platforms, Slack, Discord, or community channels, no link preview image is displayed. The site's HTML head currently lacks Open Graph (og:image) and Twitter Card (twitter:image) metadata.

Expected Behavior

badges.layer5.io should include social metadata tags in its <head> (og:image, og:title, og:description, og:url, twitter:card, and twitter:image) so that sharing the URL generates a rich card preview.

Suggested Image

Use the official Layer5 Recognition Program banner already present in the repository (src/assets/images/recognition-banner.png / .github/readme/images/recognition-banner.webp).
This asset directly represents the program name ("Layer5 Recognition Program"), includes the Layer5 brand mark, displays representative badges, and conforms to standard widescreen social card dimensions.

Environment
  • Host OS: Mac Linux Windows
  • Platform: Docker or Kubernetes
  • Meshery Server Version: stable-v
  • Meshery Client Version: stable-v

Contributor Guides and Resources

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.