Open Collective has an embed for displaying contributors, which is pretty cool.
The following embed is for html-react-parser:
The HTML of the embed is:
<a href="https://github.com/remarkablemark/html-react-parser/graphs/contributors"> <img src="https://opencollective.com/html-react-parser/contributors.svg?width=890&button=false"> </a>
And the Markdown equivalent is:
But for projects not on Open Collective, how can I display my contributors?
You can embed a linked image as long as you have the urls to the contributor’s profile and avatar.
To get the avatar url:
- Go to the profile page
- Right-click the image
Copy Image Address(or
Open Link in New Tab)
See screenshot below:
What’s copied should be similar to the url below:
?s=460&v=4 can be described as follows:
sstands for the size (width and height in pixels)
vrepresents the version used by GitHub for cache busting
Alternatively, you can add
.png to the profile url (which acts as a redirect to the avatar image):
This means you can add the following HTML to your
<a href="https://github.com/remarkablemark"> <img src="https://github.com/remarkablemark.png?size=50"> </a>
Or include the Markdown below which does the same thing:
Here’s the output: