如何将视频嵌入GitHub README.md？

Question

是否可以在GitHub上将Flash视频嵌入README.md？它没有出现：https://github.com/mattdipasquale/PicSciP

Answer 1

我强烈建议将视频放在使用GitHub Pages而不是自述文件创建的项目网站中，如VonC's answer中所述;它会比任何这些想法都好很多。但是如果你需要一个像我需要的快速修复，这里有一些建议。

使用gif

参见aloisdg's answer，结果很棒，gifs在github的自述文件上呈现;）

使用视频播放器图片

您可以诱骗用户认为视频位于带有图片的自述页面上。这听起来像是一个广告技巧，它并不完美，但它有效并且很有趣;）。

示例：

[![Watch the video](https://i.imgur.com/vKb2F1B.png)](https://youtu.be/vt5fpE0bzSY)

结果：

使用youtube的预览图片

您还可以使用youtube为您的视频生成的图片。

对于以下形式的youtube网址：

https://www.youtube.com/watch?v=<VIDEO ID>
https://youtu.be/<VIDEO URL>

preview urls的形式为：

https://img.youtube.com/vi/<VIDEO ID>/maxresdefault.jpg
https://img.youtube.com/vi/<VIDEO ID>/hqdefault.jpg

示例：

[![Watch the video](https://img.youtube.com/vi/T-D1KVIuvjA/maxresdefault.jpg)](https://youtu.be/T-D1KVIuvjA)

结果：

使用asciinema

如果您的用例是在终端中运行的，asciinema可让您录制终端会话并具有良好的降价嵌入功能。

点击分享按钮并复制降价片段。

示例：

[![asciicast](https://asciinema.org/a/113463.png)](https://asciinema.org/a/113463)

结果：

Answer 2

“Github Flavored Markdown”不支持任何页面的此类功能：

一个旧的支持主题“在markdown文件中嵌入YouTube视频”声明：

  

pages.github.io，是的，其他地方，没有。

（注意：详见“Github Top-Level Project Page”， github.io 是自2013年4月以来user and organization pages的新域名。
page GitHub publication is presented here）

这可能是一个功能请求，如语法高亮显示。

例如：“HTML5 video in markdown”（2010年8月）：

  

    

有没有办法在README.markdown文件中实现HTML5视频？

  

     

目前不是，但我们可能会扩展您将来使用自述文件做的事情。

     

与此同时，您可以使用GitHub Pages和我们的Wiki进行此操作。

---

Benjamin Oakes在评论中确认（2012年5月）：

  

我发送了支持请求。回应是不支持嵌入视频。

Answer 3

我将Alexandre Jasmin和Gab Le Roux这样的答案合并：

[![Demo CountPages alpha](https://share.gifyoutube.com/KzB6Gb.gif)](https://www.youtube.com/watch?v=ek1j272iAmc)

演示：

您可以在github上看到此演示。

我在这里使用了gifyoutube，但我建议使用本地gif转换器（如ffmpeg，see how）而不是在线转换器。

要直接将您的屏幕录制到gif，您可能需要查看ScreenToGif。

Answer 4

对于简单的动画，您可以使用GIF动画。我正在使用一个in this README file。

Answer 5

尽管这是一篇旧帖子，但我认为在此线程中已经存在的非常有用的解决方法之上，提及此问题的附加（部分和切线）解决方案会有所帮助。

在撰写本文时（2021 年 1 月 6 日），GitHub 发布了一项功能，可以将最大 10 MB 的 .mp4 和 .mov 文件上传到议题、拉取请求和讨论评论（如共享here）。这是一个直接嵌入，而不是像我们通常做的那样“链接”到外部 URL。它已经超出公开测试版。您可以通过拖放、选择或粘贴来附加文件。可以在此处查看 GitHub 新通知的预览：

也许，在未来，我们可以慢慢推动 GitHub 最终将这个原生功能也扩展到 README。

Answer 6

这是一篇旧帖子，但我正在寻找答案，我发现了这个：https://gifs.com。只需上传视频，然后创建一个我们可以在github markdown中轻松添加的gif。 我试过了，gif的质量很好。

Answer 7

这样做的一个好方法是使用任何在线 mp4 到 gif 转换器将视频转换为 gif。 那么，

步骤：1 在存储库中创建一个文件夹，您可以在其中存储要显示的所有图像和视频。

步骤：2 然后在您尝试显示的存储库中复制视频或图像的链接。例如，您想从链接中显示游戏过程的视频：(https://github.com/Faizun-Faria/Thief-Robber-Landlord-Police/blob/main/Preview/gif_english.gif)。 您可以简单地在 README.md 文件中编写以下代码来显示 gif：

![Game Process](https://github.com/Faizun-Faria/Thief-Robber-Landlord-Police/blob/main/Preview/gif_english.gif)

Answer 8

只是为了扩展@GabLeRoux的答案：

[<img src="https://img.youtube.com/vi/<VIDEO ID>/maxresdefault.jpg" width="50%">](https://youtu.be/<VIDEO ID>)

这样，您将可以在Github存储库上调整README.md文件中缩略图的大小。

Answer 9

这是第一个解决方案的旧帖子和TLDR：

1. 我刚刚打开“编辑”我的 Readme.md
2. 将视频拖放到自述文件编辑部分。
3. 等待它上传并为您提供类似 https://user-images.githubusercontent.com/...
的 URL
4. 查看预览，效果很好！

例如：

自述文件：https://github.com/s8sachin/subtitler/blob/master/README.md

原始：https://raw.githubusercontent.com/s8sachin/subtitler/master/README.md

注意：

• 该文件不会存储在您的存储库下。
• Webm 对我不起作用，而是使用了 mp4。