Search code examples
githubmetadatafacebook-opengraphshare-open-graph

how can I get image preview with data of github after sharing repo?


how can I get an image like this?

is there any linking structure for getting it?

enter image description here

like you see there is some data, like userName, RepoName, Logo, description, N contributions, N issues, N stars, N forks.

  1. sometimes I just paste the normal link https://github.com/user/repoName in a social media for getting it, but I tried now the social don't get automatically the image...
    if social can get it I think is stored somewhere, is there a link to get there direcly?

  2. OR usually, I go to google and search the name of "my repo" with "my name" and "Github", and when I find it a downloading it, but not find it.

I tried to search also here, but not solve any problem: How Can I get My Social Preview Image Link of My Github Repo using Git API or Any Logic?


Solution

  • I think that GitHub does it by itself, I think you created the repo a little before, so you need to wait.

    but if you need now the solution
    this can be used:

    here a example:

    follow the instructions/docs and change the name to your name GitHub profile/repo

    ![Readme Card](https://github-readme-stats.vercel.app/api/pin/?username=laaouatni&repo=gcode.js)
    

    Readme Card

    like you see is a image, and also a new repo with only one star so I think also yours can work fine!

    enter image description here


    however, the first answer in the link (the one with 4+ upvotes) can work fine if you have a lot time ago created the repo: https://stackoverflow.com/a/61948112/17716837 does the job

    1. you just need to copy the code there,
    2. pasted inside the link of graphql tester.
    3. if is returning an image you are ok,

    if not returning the image with ingo, this means GitHub doesn't have the repo image for now