GitHub README.md에 비디오를 포함시키는 방법은 무엇입니까?


답변:


118

" Github Flavored Markdown "은 모든 페이지에서 이러한 종류의 기능을 지원하지 않습니다.

이전 지원 스레드 "마크 다운 파일에 YouTube 동영상 포함"이 언급되었습니다.

pages.github.io, 그래, 다른 곳, 아니.

(참고 : "에 설명 된대로 Github에서 최상위 프로젝트 페이지 ", github.io을 위한 새로운 도메인입니다 사용자 및 조직 페이지 4월 2013 년 이후 페이지 GitHub의 간행물이 여기에 소개됩니다 )

이것은 구문 강조와 같은 기능 요청 일 수 있습니다.

예를 들어 " HTML5 동영상 마크 다운 "(2010 년 8 월) :

README.markdown파일에 HTML5 비디오를 구현할 수있는 방법이 있습니까?

현재는 아니지만 앞으로 README로 수행 할 수있는 작업을 확장 할 수 있습니다.

그 동안 GitHub 페이지와 Wiki를 사용하여이 작업을 수행 할 수 있습니다.


Benjamin Oakes 는 의견을 확인합니다 (2012 년 5 월).

지원 요청을 보냈습니다. 이에 대한 응답은 비디오 임베딩이 지원되지 않는다는 것입니다.


2
이러한 연결은 끊어진 것 같습니다. 그들은 지금 github.com/contact 로 이동합니다. 누구든지 보관 된 버전에 액세스 할 수 있습니까? Google 캐시 또는 Wayback Machine에서 가져 오는 데 어려움을 겪고 있습니다.
Benjamin Oakes

1
위키 페이지에서 HTML5 비디오의 가치가 더 이상 작동하지 않는 것 같습니다.
Benjamin Oakes

지원 요청을 보냈습니다. 이에 대한 응답은 비디오 임베딩이 지원되지 않는다는 것입니다.
Benjamin Oakes

17
내가 공표 할 수있는 공개 문제가 있습니까?
Will

2
@hyipscript 실제로 확실하지 않습니다 : 그 인용문은 5 년 된 GitHub 지원 스레드 (대답에서 링크를 복원했습니다), [Chris Wanstrath-defunkt] ( github.com/defunkt )에서 온 것입니다. GitHub 설립자. 자세한 내용은 없습니다.
VonC

252

VonC의 답변 에서 설명한 것처럼 readme 대신 GitHub Pages로 만든 프로젝트 웹 사이트에 비디오를 배치하는 것이 좋습니다 . 이 아이디어들보다 훨씬 나을 것입니다. 그러나 내가 필요한 것처럼 빠른 수정이 필요한 경우 다음 제안 사항이 있습니다.

gif 사용

aloisdg의 답변을 참조하십시오 . 결과는 훌륭합니다 .gif 는 github의 readme에 렌더링됩니다.)

비디오 플레이어 사진 사용

비디오가 그림이있는 readme 페이지에 있다고 생각하도록 사용자를 속일 수 있습니다. 그것은 광고 트릭처럼 들리지만 완벽하지는 않지만 작동하며 재미 있습니다.).

예:

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

결과:

비디오 시청

YouTube의 미리보기 사진 사용

YouTube에서 생성 한 사진을 비디오에 사용할 수도 있습니다.

다음 형식의 YouTube URL의 경우 :

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

미리보기 URL은 형태입니다 :

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)

결과:

아스키 캐스트


1
asciicast (예 : github.com/marionebl/svg-term-cli ) 에서 gif 또는 애니메이션 svg 이미지를 생성하는 멋진 도구도 있습니다. ;-)
JepZ

100

나는 Alexandre JasminGab Le Roux 답변을 다음과 같이 결합합니다.

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

데모:

데모 CountPages 알파

이 데모는 github 에서 볼 수 있습니다 .

내가 사용 gifyoutube를 (는 FFmpeg처럼 여기지만 로컬 GIF 변환기를 사용하는 것이 좋습니다 방법을 볼 대신 온라인 하나).

화면을 gif로 직접 기록하려면 ScreenToGif 를 확인하십시오 .


1
나는 이것이 선택된 대답이어야한다고 생각합니다. 이것은 당신이 얻을 수있는 영상에 가장 가까운, 대부분의 사람들에게 그것은 이다 비디오는. 비디오 란 무엇입니까? 여전히 프레임이 순서대로 움직여 재생중인 환상을줍니다. 애니메이션 GIF는 같은 것입니다 ... OP가 특별히 플래시 비디오를 요청했지만 불가능한 것은 아니지만이 방법을 사용하여 플래시 비디오를 애니메이션 GIF로 변환 할 수 있습니다.
웨이드

1
당신은 똑똑한 사람입니다. 나는 지금 이것을 어디서나 사용하고 있습니다. 당신은 (내가 share.gifyoutube.com URL 불구하고 찾을 수 없습니다) 즉, 직접 URL을 선택할 수있는 URL을 추가 할 수 있습니다
Dheeraj 바스 카르

지금까지 사이트는 gifs.com이며 j.gifs.com에서 다운로드를 받고 다운로드 하려면 gifs.com 계정이 필요합니다.
Jeroen Wiert Pluimers

1
Licecap 은 mac 사용자를위한 screentogif의 좋은 대안입니다!
J.beenie

26

간단한 애니메이션의 경우 애니메이션 GIF를 사용할 수 있습니다. 예를 들어이 README 파일에서 하나 사용하고 있습니다.


1
@HarishKayarohanam은 "github이이 기능을 제공 할 때까지"일반적으로 말하거나 그런 일을하고 있었습니까? 그렇다면 지금까지 완료 했습니까? :)
Paul

2
@Paul 아니요, 몇 달 전에 배운 것처럼이 작업을 수행하고 있지 않습니다 ... 문제를 해결해주십시오. github.com/github/markup/issues/538
Petr Dvořák

이를 수행 할 때는 접근성을 고려하십시오. 주의가 어려운 사람들은 옆에 움직이는 애니메이션이있는 경우 텍스트를 가져 오는 데 어려움을 겪을 수 있습니다.
Eneroth3

6

@GabLeRoux의 답변을 확장하려면 다음을 수행하십시오.

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

이런 식으로 Github 저장소의 README.md 파일에서 썸네일 이미지의 크기를 조정할 수 있습니다.


3

이것은 오래된 게시물이지만 답변을 찾고 있었고 https://gifs.com을 찾았습니다 . 비디오를 업로드하면 github 마크 다운에 쉽게 추가 할 수있는 gif가 생성됩니다. 나는 그것을 시도했다, gif의 품질은 좋은 것이다.

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.