Der verlinkte Blogbeitrag zeigt, wie man relativ einfach YouTube Channel oder Playlist Videos auf der eigenen Website einbauen kann. Die direkte Verbindung über die YouTube API hat den Vorteil, dass neu hochgeladene Videos meines Channels automatisch auch auf der Website erscheinen. Die API Lösung ist flexibel und bietet daher viele Möglichkeiten für Anwendungsbeispiele. Die Demos unten zeigen daher nur einen Teil der Einsatzmöglichkeiten.
Credits: sevenX.de Bootstrap Google API
Diese Variante erstellt eingebette Iframe Videos, welche direkt abgespielt werden können. Aus der API Quelle wird hier lediglich die YouTube Video ID benötigt und verarbeitet.
Die YouTube API überträgt alle relevanten Informationen zu den Videos. Neben Titel, Beschreibung, Video ID werden auch die Pfade zu den Video Thumbnails in verschiedenen Größen bereitgestellt. Das Beispiel unten verarbeitet zur Anzeige eines dieser Thumbnails und wird um den Titel ergänzt. Zur Wiedergabe in der Lightbox wird das geniale Magnific Popup Plugin genutzt an das wir die Video ID übergeben.
Diese Variante greift auch auf die Iframe Einbindung der YouTube Videos zurück. Mit dem (Bootstrap) Carousels hat man eine kompakte Möglichkeit mehrere Videos darzustellen. Mit Hilfe von ein bisschen Zusatzcode stoppt das Carousel bei Mouseover, so dass man sich ein gestartetes Video auch komplett anschauen kann. Zudem Pausieren gestartete Videos beim Wechsel (auto oder klick) auf den nächsten Slide.