Skip to content

Instantly share code, notes, and snippets.

@vinkla

vinkla/CDN.md

Last active Sep 25, 2020
Embed
What would you like to do?
A guide on how to upload images to GitHub's CDN through issues and pull requests.

Upload Images to GitHub's CDN

  1. First, visit any repository on GitHub and click your way through to the issues page.

  2. Create a new issue by clicking the New Issue button. You'll now see title and description fields.

  3. Drag-and-drop an image onto the description field. This will start the uploading process.

  4. Copy the URL and use it in README, issues or pull requests however you like.

Example of uploading image to GitHub's CDN


Website | Twitter | GitHub

@himelnagrana

This comment has been minimized.

Copy link

@himelnagrana himelnagrana commented Dec 6, 2017

Awesome and WOWsome!

@roskoff

This comment has been minimized.

Copy link

@roskoff roskoff commented May 9, 2018

🥇

@snowman

This comment has been minimized.

Copy link

@snowman snowman commented Jun 22, 2018

Sweet

@joernroeder

This comment has been minimized.

Copy link

@joernroeder joernroeder commented Oct 9, 2018

github suggests docs or hidden .github folder in repo root https://help.github.com/articles/about-readmes/

@ohld

This comment has been minimized.

Copy link

@ohld ohld commented Dec 2, 2018

WE NEED AN API FOR THAT.

@herrmanthegerman

This comment has been minimized.

Copy link

@herrmanthegerman herrmanthegerman commented Jan 15, 2019

Is there an UI to manage images that a user has uploaded, e.g., so that a user can delete an image?

@prensmiskin

This comment has been minimized.

Copy link

@prensmiskin prensmiskin commented Feb 13, 2019

Teşekkürler harika adam.

@RabaaRubaye

This comment has been minimized.

Copy link

@RabaaRubaye RabaaRubaye commented Mar 18, 2019

Thank you ... I spent an hour trying to do this following a youtube tutorial and I failed ... and finally I found you and I did it in 1 minute... thank you for saving my day.

@PAESSoon

This comment has been minimized.

Copy link

@PAESSoon PAESSoon commented Apr 24, 2019

Awesome! Thank you!!

@MubinSayed

This comment has been minimized.

Copy link

@MubinSayed MubinSayed commented May 6, 2019

Thanks

@PotLid

This comment has been minimized.

Copy link

@PotLid PotLid commented May 24, 2019

This is by far the most intuitive and easy. Thanks mate!

@astout

This comment has been minimized.

Copy link

@astout astout commented May 28, 2019

Does this suddenly no longer work for others? I drag and drop and chrome just opens the local file. Safari behavior just pastes in the path to the local file. On macOS 10.14.5.

Edit: Interesting...it works in comments, but no longer in Wiki.

@PotLid

This comment has been minimized.

Copy link

@PotLid PotLid commented May 29, 2019

@astout

Same on my safari Mojave 10.14.5.

Seems only works on few cases.

@evertdespiegeleer

This comment has been minimized.

Copy link

@evertdespiegeleer evertdespiegeleer commented Jul 25, 2019

WE NEED AN API FOR THAT.

Now there is an API for that 😉

@AWinterman

This comment has been minimized.

Copy link

@AWinterman AWinterman commented Aug 15, 2019

WE NEED AN API FOR THAT.

Now there is an API for that 😉

To save others the click, there is not an api. The link takes you to a project that programmatically navigates to the issue page, inserts the image you want to upload, waits for it to finish uploading, and then returns the url. While it is literally a CLI, it's not something I would recommend coding against.

@maple3142

This comment has been minimized.

Copy link

@maple3142 maple3142 commented Aug 24, 2019

WE NEED AN API FOR THAT.

Now there is an API for that 😉

To save others the click, there is not an api. The link takes you to a project that programmatically navigates to the issue page, inserts the image you want to upload, waits for it to finish uploading, and then returns the url. While it is literally a CLI, it's not something I would recommend coding against.

I have a similar CLI project for that, and it doesn't use a browser(puppeteer) for that.
https://github.com/maple3142/ghfileupl

@NawalJAhmed

This comment has been minimized.

Copy link

@NawalJAhmed NawalJAhmed commented Sep 4, 2019

Yes, this works quite well. If you ever want to center your image, you can use HTML tags. For example:

<p align="center">
<img src="Link you used by following the above tutorial.">
</p>

@devoirtechsandip

This comment has been minimized.

Copy link

@devoirtechsandip devoirtechsandip commented Nov 21, 2019

Thanks for tip, it work like charm

@sanghuncheong

This comment has been minimized.

Copy link

@sanghuncheong sanghuncheong commented Dec 19, 2019

Thank you! This tip helps me a lot!

@mikedonnici

This comment has been minimized.

Copy link

@mikedonnici mikedonnici commented Dec 23, 2019

10 x 👍

@ajaxray

This comment has been minimized.

Copy link

@ajaxray ajaxray commented Dec 30, 2019

🎉 WOW!! Coolness overloaded!! 🎉

@lightdollars

This comment has been minimized.

Copy link

@lightdollars lightdollars commented Dec 30, 2019

very cool i like this

@lightdollars

This comment has been minimized.

Copy link

@lightdollars lightdollars commented Dec 30, 2019

Yes, this works quite well. If you ever want to center your image, you can use HTML tags. For example:

<p align="center">
<img src="Link you used by following the above tutorial.">
</p>

this is even better thanks for the tip

@ajmainekhan

This comment has been minimized.

Copy link

@ajmainekhan ajmainekhan commented Jan 5, 2020

Thanks, I need this for my website

@xerosanyam

This comment has been minimized.

Copy link

@xerosanyam xerosanyam commented Jan 13, 2020

This is amazing
image

@brunotdantas

This comment has been minimized.

Copy link

@brunotdantas brunotdantas commented Feb 9, 2020

Thanks a lot =)

@Zeng95

This comment has been minimized.

Copy link

@Zeng95 Zeng95 commented Feb 27, 2020

Thank you!!

@sitthykun

This comment has been minimized.

Copy link

@sitthykun sitthykun commented Mar 18, 2020

Thank you so much

@azarboon

This comment has been minimized.

Copy link

@azarboon azarboon commented Mar 23, 2020

thanks

@molhokwai

This comment has been minimized.

Copy link

@molhokwai molhokwai commented Apr 1, 2020

Thanks a lot

@mdsrosa

This comment has been minimized.

Copy link

@mdsrosa mdsrosa commented Apr 20, 2020

Is there an UI to manage images that a user has uploaded, e.g., so that a user can delete an image?

I would like to know this as well. Does anybody @github know?

@ruimaruima

This comment has been minimized.

Copy link

@ruimaruima ruimaruima commented May 29, 2020

Thanks

@avble

This comment has been minimized.

Copy link

@avble avble commented Jun 6, 2020

Many thanks

@tanveer263

This comment has been minimized.

Copy link

@tanveer263 tanveer263 commented Jun 11, 2020

thanks for your help

@jarunm

This comment has been minimized.

Copy link

@jarunm jarunm commented Jun 11, 2020

Thanks for the help!

@SHREYAS1188

This comment has been minimized.

Copy link

@SHREYAS1188 SHREYAS1188 commented Jun 23, 2020

Thank you teacher @vinkla it helped it worked :))

@sosiristseng

This comment has been minimized.

Copy link

@sosiristseng sosiristseng commented Jul 7, 2020

Is there an UI to manage images that a user has uploaded, e.g., so that a user can delete an image?

I would like to know this as well. Does anybody @github know?

I'm not a GitHub guy but AFAIK, no, unless you call the support. So don't put sensitive images there.

See this thread on SO

The official documentation did not mention how to delete them, either.

@studmuffin30

This comment has been minimized.

Copy link

@studmuffin30 studmuffin30 commented Jul 16, 2020

can we upload svg as well ?

@thevickypedia

This comment has been minimized.

Copy link

@thevickypedia thevickypedia commented Jul 29, 2020

Works like a charm 👍

@sosiristseng

This comment has been minimized.

Copy link

@sosiristseng sosiristseng commented Jul 29, 2020

can we upload svg as well ?

Unfortunately, you can't. You could put it directly in the repository since svg's are text files as well.

@trozler

This comment has been minimized.

Copy link

@trozler trozler commented Aug 21, 2020

gg

@setia1yogi

This comment has been minimized.

Copy link

@setia1yogi setia1yogi commented Sep 3, 2020

helpfull

@IhwanID

This comment has been minimized.

Copy link

@IhwanID IhwanID commented Sep 3, 2020

Nice

@adityatyagijtg

This comment has been minimized.

Copy link

@adityatyagijtg adityatyagijtg commented Sep 16, 2020

For the ones who still couldn't do it, I have written a detailed article with screenshots:
Read Here

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.