Skip to main content

Adding social preview to your repository

When we have an open-source project, it is important to share it so people can be interested in it and be able to contribute to it. Images on social media have a great impact because they can make your content stand out from the others.

Before you add a social preview, the repository links expand to provide the repository's basic information and the owner's avatar. Like in the left picture below:

Including a picture in your repository can make it easier for others to find your project on different social media sites. For example, how the right image provided a good social preview of its repository. 

Steps on how to add a social preview to your repository​

  1. Go to GitHub and sign in to your account.

  2. Pick any of your repositories or you can create a new one to start a new project.

  3. Navigate to the main page of the repository using the tab navigation towards the top of the page and click ⚙Settings.

  1. As soon as you click the settings, you will see the general settings. Scroll down a bit and you will see the Social preview.

  1. In Social preview, click Edit
  • To add an image, click on Upload an image and pick any image you want.

After you upload an image, you will see a preview of something like this.

Previewing your image banner​

You can preview below the before and after of your repository using and not using social preview when shared on any social media platform.

imageimage
BeforeAfter
  • To remove an image, you can simply click Remove image

Complete demo (GIF)​

188549721-fd4fdc17-f669-4091-8f3

💡 Tips:​

  • It is recommended that you should use JPG, PNG and GIF as a file format for your images.
  • For the best quality rendering, it is recommended to keep the image at 640 by 320 pixels.
  • PNG transparency is also supported. When using an image with transparency, consider how it might appear on platforms that don't support transparency or backgrounds with various colors.
  • Always make your banner simple and have a readable font. So, when someone sees the link, they will understand it right away and not skip it.

Congratulations! You have successfully learned how to add social preview to your repository 🚀