Jestem dość nowy w znacznikach (choć bardzo łatwo jest go podnieść). Pracuję nad pakietem i staram się, aby strony wiki wyglądały ładnie jako podręcznik pomocy. Mogę dość łatwo wstawić link do filmu na YouTube na stronie wiki, ale jak osadzić film na YouTube. Wiem, że to może nie być możliwe.

Przeczytałem, że możesz używać tagów HTML, więc próbowałem osadzić HTML dla tego linku w następujący sposób:

<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>

I zapisałem stronę, ale nic się nie stało.

1. Czy można osadzić film z YouTube na stronach wiki GitHub?
2. Jeśli tak to jak?

Nie można bezpośrednio osadzać filmów, ale możesz umieścić obraz, który prowadzi do filmu na YouTube:

[![IMAGE ALT TEXT HERE](https://img.youtube.com/vi/YOUTUBE_VIDEO_ID_HERE/0.jpg)](https://www.youtube.com/watch?v=YOUTUBE_VIDEO_ID_HERE)

Aby uzyskać więcej informacji, zapoznaj się z tym ściągiem Markdown na GitHub.

Kompletny przykład

Rozszerzając @MGA „s Odpowiedź

Chociaż nie można osadzić wideo w Markdown, można go „sfałszować”, dołączając prawidłowy obraz połączony do pliku znaczników, używając tego formatu:

[![IMAGE ALT TEXT](http://img.youtube.com/vi/YOUTUBE_VIDEO_ID_HERE/0.jpg)](http://www.youtube.com/watch?v=YOUTUBE_VIDEO_ID_HERE "Video Title")

Wyjaśnienie obniżki

Jeśli ten fragment znaczników wygląda na skomplikowany, podziel go na dwie części:

obraz
![image alt text](https://example.com/link-to-image)
zawinięty w link
[link text](https://example.com/my-link "link title")

Przykład użycia Valid Markdown i YouTube Thumbnail:

Pozyskujemy obraz miniatury bezpośrednio z YouTube i linkujemy do rzeczywistego wideo, więc gdy osoba kliknie obraz / miniaturę, zostanie przeniesiona do filmu.

Kod:

[![Everything Is AWESOME](https://img.youtube.com/vi/StTqXEQ2l-Y/0.jpg)](https://www.youtube.com/watch?v=StTqXEQ2l-Y "Everything Is AWESOME")

LUB Jeśli chcesz dać czytelnikom wizualną wskazówkę, że obraz / miniatura jest w rzeczywistości odtwarzalnym filmem, zrób własny zrzut ekranu wideo w YouTube i użyj go jako miniatury.

Przykład użycia zrzutu ekranu z kontrolkami wideo jako Visual Cue:

Kod:

[![Everything Is AWESOME](http://i.imgur.com/Ot5DWAW.png)](https://youtu.be/StTqXEQ2l-Y?t=35s "Everything Is AWESOME")

 Wyraźne zalety

Chociaż wymaga to kilku dodatkowych kroków ( a ) zrobienia zrzutu ekranu wideo i ( b ) przesłania go, aby można było użyć obrazu jako miniatury, ma on 3 wyraźne zalety :

1. Osoba czytająca Twoją obniżkę (lub wynikową stronę html) ma wizualną wskazówkę , że może obejrzeć wideo ( sterowanie wideo zachęca do klikania )
2. Możesz wybrać konkretną klatkę w filmie, która będzie używana jako miniatura (dzięki czemu treść będzie bardziej wciągająca )
3. Możesz utworzyć link do określonego czasu w filmie, od którego rozpocznie się odtwarzanie po kliknięciu połączonego obrazu. (w naszym przypadku od 35 sekund)

Wykonanie i przesłanie zrzutu ekranu zajmuje kilka sekund, ale przynosi dużą korzyść.

Działa wszędzie!

Ponieważ jest to standardowa obniżka, działa wszędzie. wypróbuj go na GitHub, Reddit, Ghost, a tutaj na Stack Overflow.

Vimeo

To podejście działa również w przypadku filmów Vimeo

Przykład

Kod

[![Little red riding hood](http://i.imgur.com/7YTMFQp.png)](https://vimeo.com/3514904 "Little red riding hood - Click to Watch!")

Uwagi:

• Jak zrobić zrzut ekranu: http://www.take-a-screenshot.org/ (wszystkie platformy)
• Prześlij obraz miniatury: po zrobieniu zrzutu ekranu możesz go przeciągnąć i upuścić na imgur.com, aby przesłać i natychmiast użyć go jako miniatury
• Informacje o miniaturze YouTube: Jak uzyskać miniaturę wideo YouTube z interfejsu API YouTube?

Markdown oficjalnie nie obsługuje osadzania wideo, ale możesz osadzić w nim surowy HTML. Przetestowałem z GitHub Pages i działa bezbłędnie.

1. Przejdź do strony Wideo na YouTube i kliknij przycisk Udostępnij
2. Wybierz Osadź
3. Skopiuj i wklej fragment kodu HTML w swoim przecenianiu

Fragment wygląda następująco:

    <iframe width="560" height="315"
src="https://www.youtube.com/embed/MUQfKFzIOeU" 
frameborder="0" 
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" 
allowfullscreen></iframe>

PS: Możesz sprawdzić podgląd na żywo tutaj

Jeśli lubisz tagi HTML bardziej niż markdown + centrowanie:

<div align="center">
  <a href="https://www.youtube.com/watch?v=YOUTUBE_VIDEO_ID_HERE"><img src="https://img.youtube.com/vi/YOUTUBE_VIDEO_ID_HERE/0.jpg" alt="IMAGE ALT TEXT"></a>
</div>

Wyśrodkuj wyrównanie wideo za pomocą miniatury i łącza:

<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>

Wynik:

Stworzyłem https://yt-embed.herokuapp.com/, aby to uprościć. Użycie jest bezpośrednie, z powyższych przykładów:

[![Everything Is AWESOME](https://yt-embed.herokuapp.com/embed?v=StTqXEQ2l-Y)](https://www.youtube.com/watch?v=StTqXEQ2l-Y "Everything Is AWESOME")

Spowoduje to:

Wystarczy zadzwonić na: https://yt-embed.herokuapp.com/embed?v=[video_id] jako obraz zamiast https://img.youtube.com/vi/ .

• Możemy użyć kodu HTML w Markdown.
• Sprawdź oficjalny dokument na stronie Osadzanie wideo lub playlisty na stronie support.google.com/youtube

<iframe width="560" height="315"
src="https://www.youtube.com/embed/videoseries?list=PLx0sYbCqOb8TBPRdmBHs5Iftvv9TPboYG"
frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>

Sprawdź więcej porad i wskazówek na temat YouTube