Unable to embed a gif on imgur to a README.md on github

假如想象 提交于 2019-12-04 06:50:27

The gif you shared is 19MB in size.

GitHub routes all content through https://camo.githubusercontent.com/ even for external source now. Sharing a file that is bigger than the size limit (10MB) will get you a "Content length exceeded" error.

I tried sharing it on Google Drive, Dropbox, Droplr, my own server all ran into this issue unless the file size is below 10MB. It also doesn't matter if your syntax is in html or markdown.

<img src="https://static01.bbi.io/2Wt9Tk.gif"/>

!(image)[https://static01.bbi.io/2Wt9Tk.gif]

Your solution is to resize your gif. You can do it with service like this one: https://ezgif.com/resize .

GitHub does support Imgur embeds. Make sure to provide the image extension, which isn't on Imgurs default share hyperlink.

BAD

![Imgur Image](http://i.imgur.com/zTONrOD)

GOOD

![Imgur Image](http://i.imgur.com/zTONrOD.jpg)

Imgur also provides this preformatted link under the MarkDown links menu, see image below.

See also an example readme.md with Imgur image.

I believe the only way to link images from imgur would be something like this:

![An open source player](http://i.imgur.com/dNYswmI.gif)

However (in my experience) GitHub does not support imgur, I do not know if there are any other supported image share service.

If you can't find a supported service just do something like this as a last resort to just leave a link to the image:

###Description
A open source player.

### Screenshot
#[Screenshot](http://i.imgur.com/dNYswmI.gif)

You can still have a gif in readme.md that's above 10MB if you include the gif itself in your repository.

This is because images from the repository itself are not routed through https://camo.githubusercontent.com/.

You could upload the gif to a misc folder and embed it like so:

<img src='./misc/your_file.gif'>

I've run into this issue as well. Github will not allow you to upload anything over 10Mb. However, they offer an optional large file storage service specifically for audio/video/etc. This is what you want:

lfs-github

Although the code below shows you how to reference the image link in the Github README.md, you just can't copy the URL from your browser's address bar: you must right-click image and choose Copy Image Location

![Description of image being displayed in Github README.md](PASTE-LINK-YOU-COPIED-HERE)

BTW, if you wanted to embed an image in a stackoverflow post, the same code would work.

I can't actually upload an image in this post due to insufficient rep points, so I'll post the IMGUR link to my illustrative image instead: https://i.imgur.com/p4wfMRQ.jpg

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!