Wie kann ich ein YouTube-Video auf GitHub-Wiki-Seiten einbetten?

Question

Ich bin ein ziemlicher Neuling auf dem Gebiet des Markup (obwohl es sehr leicht zu erlernen ist). Ich arbeite an einem Paket und versuche, die Wiki-Seiten so zu gestalten, dass sie wie ein Hilfehandbuch aussehen. Ich kann einen YouTube-Video-Link ganz einfach in die Wiki-Seite einfügen, aber wie bette ich ein YouTube-Video ein? Ich weiß, dass das vielleicht nicht möglich ist.

Ich habe gelesen, dass man HTML-Tags verwenden kann, also habe ich versucht, mit HTML wie folgt einzubetten enlace wie folgt:

<object width="425" height="350">
  <param name="movie" value="http://www.youtube.com/user/wwwLoveWatercom?v=BTRN1YETpyg" />
  <param name="wmode" value="transparent" />
  <embed src="http://www.youtube.com/user/wwwLoveWatercom?v=BTRN1YETpyg"
         type="application/x-shockwave-flash"
         wmode="transparent" width="425" height="350" />
</object>

Ich habe die Seite gespeichert, aber es ist nichts passiert.

1. Ist es möglich, ein YouTube-Video auf GitHub-Wiki-Seiten einzubetten?
2. Wenn ja, wie?

Answer 1

Das Hinzufügen eines Links mit dem ursprünglich von YouTube verwendeten Thumbnail ist eine Lösung, die funktioniert. Das von YouTube verwendete Thumbnail ist auf folgende Weise zugänglich:

• wenn der offizielle Videolink lautet:
  • https://www.youtube.com/watch?v=5yLzZikS15k
• dann ist das Vorschaubild:
  • https://img.youtube.com/vi/5yLzZikS15k/0.jpg

Dieser Logik folgend, führt der nachstehende Code zu einwandfreien Ergebnissen:

<div align="left">
      <a href="https://www.youtube.com/watch?v=5yLzZikS15k">
         <img src="https://img.youtube.com/vi/5yLzZikS15k/0.jpg" style="width:100%;">
      </a>
</div>

Answer 2

Video mit Thumbnail und Link zentriert ausrichten:

<div align="center">
      <a href="https://www.youtube.com/watch?v=StTqXEQ2l-Y">
     <img 
      src="https://img.youtube.com/vi/StTqXEQ2l-Y/0.jpg" 
      alt="Everything Is AWESOME" 
      style="width:100%;">
      </a>
    </div>

Ergebnis:

Answer 3

Ich habe eine API erstellt, die eine schöne Abspieltaste und einen Hintergrund hinzufügt. Um es klickbar zu machen, können Sie es wie folgt verwenden:

[![](https://markdown-videos.deta.dev/youtube/{video_id})](https://youtu.be/{video_id})

Beispiel:

Den Quellcode und die Dokumentation finden Sie hier: https://github.com/Snailedlt/Markdown-Videos

Answer 4

Ich habe eine Chrome-Browser-Erweiterung geschrieben, xhub mit dem Sie YouTube-Videos (und auch andere Dinge) in GitHub-Seiten einbetten können.

Holen Sie es aquí . Dann fügen Sie etwas wie dies hinzu

A video:
```youtube-embed
{
   "width": "560",
   "height": "315",
   "src": "https://www.youtube.com/embed/dQw4w9WgXcQ",
   "title": "YouTube video player",
   "frameborder": "0",
   "allow": "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",
   "allowfullscreen": true
}
```

zu Ihrem Markdown-Code. Es gibt Ihnen

Answer 5

Oktober 2022 Update

Warum so hart arbeiten?

github.com erlaubt das Ziehen und Ablegen von Bildern und Videos in Issues und PRs.

Wenn Sie Ihre README.md auf github.com und ziehen Sie ein MP4 auf die Seite, erhalten Sie einen eingebetteten Videoplayer mit Audio (was bei einem GIF nicht der Fall ist).

Es gibt eine Größenbeschränkung... Ich glaube, sie liegt bei 100 MB für Assets, die auf diese Weise hochgeladen werden.

Enorme Vorteile

• Das MP4 ist nicht in der .git Repository, hat also keinen Einfluss auf die Klongeschwindigkeit oder die Größe des lokalen Repositorys
• Keine anderen Dienste involviert (kein YouTube, keine 3rd-Part-Apps)
• Audio (GIFs sind toll... aber es gibt einen Grund, warum wir heute nicht mehr in Stummfilme gehen)

Demo-Zeit

https://github.com/huntharo/video-test