CODEWITHSUNDEEP
githubmetadatafacebook-opengraphshare-open-graph
user19485937
user19485937

Reputation:

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?

Upvotes: 1

Views: 1734

Answers (2)

WinnieNotThePooh
WinnieNotThePooh

Reputation: 180

Here is the full python code to get info about repo including the preview image

import requests 
from bs4 import BeautifulSoup
    
def fetch_github_repo_info(repo_url):
    # Extract the owner and repo name from the URL
    parts = repo_url.rstrip('/').split('/')
    owner = parts[-2]
    repo = parts[-1]

    # Fetch repository data from GitHub API
    api_url = f"https://api.github.com/repos/{owner}/{repo}"
    headers = {
        'Accept': 'application/vnd.github.v3+json'
    }
    response = requests.get(api_url, headers=headers)
    response.raise_for_status()
    return response.json()

def fetch_github_preview_metadata(repo_url):
    # Fetch the HTML content of the repository page
    response = requests.get(repo_url)
    response.raise_for_status()

    # Parse the HTML content using BeautifulSoup
    soup = BeautifulSoup(response.content, 'html.parser')

    # Extract Open Graph meta tags
    og_title = soup.find('meta', property='og:title')
    og_description = soup.find('meta', property='og:description')
    og_image = soup.find('meta', property='og:image')
    og_url = soup.find('meta', property='og:url')

    # Extract content from the meta tags
    title = og_title['content'] if og_title else 'No title available'
    description = og_description['content'] if og_description else 'No description available'
    image = og_image['content'] if og_image else 'No image available'
    url = og_url['content'] if og_url else repo_url

    return {
        'title': title,
        'description': description,
        'image': image,
        'url': url
    }

def display_preview(metadata, topics):
    print("Title: ", metadata['title'])
    print("Description: ", metadata['description'])
    print("Image URL: ", metadata['image'])
    print("URL: ", metadata['url'])
    print("Topics: ", ', '.join(topics))

if __name__ == '__main__':
    repo_url = input("Enter GitHub repository URL: ")
    repo_info = fetch_github_repo_info(repo_url)
    metadata = fetch_github_preview_metadata(repo_url)
    topics = repo_info.get('topics', [])[:5]  # Get first 5 topics
    display_preview(metadata, topics)

Upvotes: 0

Laaouatni Anas
Laaouatni Anas

Reputation: 3875

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

Upvotes: 1

Related Questions