Videos sind hervorragend geeignet, um das Engagement der Benutzer auf Ihrer Website zu steigern. Aber das Einbetten von Videos kann dazu führen, dass Ihre Website langsamer lädt, was für die Besucher nicht gut ist.
Eine Möglichkeit, dies zu beheben, ist die Verwendung von „Lazy Loading“ für Ihre Videos.
Lazy Loading hilft Ihrer Website, schneller zu laden, indem Videos nur dann geladen werden, wenn sie angezeigt werden. Das bedeutet, dass Ihre Seite nicht durch das gleichzeitige Laden aller Videos verzögert wird. Das ist ein einfacher Trick, der die Leistung Ihrer Website verbessern kann.
In dieser Anleitung zeigen wir Ihnen, wie Sie in WordPress ganz einfach Lazy Loading für Videos hinzufügen können.
Was ist Lazy Loading und wie funktioniert Lazy Loading für Videos?
Lazy Loading ist eine Technik, bei der das Laden von unwichtigen Elementen auf einer Webseite verzögert wird, bis sie benötigt werden. Für Videos bedeutet dies, dass sie nur geladen werden, wenn sie angezeigt werden.
Wenn Sie ein Video auf Ihrer Website einbetten, müssen zusätzliche externe Skripte und Dateien geladen werden. Diese zusätzliche Belastung kann sich negativ auf die Leistung Ihrer Website auswirken.
Video Lazy Loading hilft, indem es eingebettete YouTube- und Vimeo-Videos durch ein anklickbares Vorschaubild ersetzt. Wenn Besucher auf das Bild klicken, wird das Video geladen und abgespielt.
Da Bilder viel kleiner sind als Videos, verbessert die Technik des „Lazy Loading“ die Geschwindigkeit der Seite erheblich.
Experten-Tipp: Sie möchten Ihre Website beschleunigen, wissen aber nicht, wie? Unser Expertenteam kümmert sich um alles, von kompletten Leistungsprüfungen bis hin zu Caching-Konfigurationen, der Einrichtung eines CDN und vielem mehr. Informieren Sie sich noch heute über unsere Dienste zur Optimierung der Website-Geschwindigkeit!
Nachdem Sie nun die Vorteile kennen, wollen wir uns ansehen, wie man YouTube- und Vimeo-Videos in WordPress verzögert laden kann.
Video-Anleitung
Wenn Sie schriftliche Anleitungen bevorzugen, lesen Sie bitte weiter.
Wie man Lazy Loading für Videos in WordPress hinzufügt
Um Lazy Loading für Videos hinzuzufügen, müssen Sie zunächst das Plugin Lazy Load for Videos installieren und aktivieren.
Dieses Plugin ist sofort einsatzbereit, und Sie müssen keine lazy-loading jQuery-Skripte oder Code bearbeiten.
Und um zu sehen, ob Ihr Lazy Loading funktioniert, müssen Sie nur einen Beitrag oder eine Seite anzeigen, die ein YouTube- oder Vimeo-Video enthält. Sie werden feststellen, dass ein Vorschaubild für das Video und ein Button zum Abspielen die Standard-Player ersetzen.
Wenn Sie auf das Bild klicken, wird das Video geladen und abgespielt.
Möglicherweise bemerken Sie eine kurze Sekunde Verzögerung beim Laden des Videos, aber das ist völlig normal. Machen Sie sich keine Sorgen, das träge Laden funktioniert einwandfrei.
Beachten Sie, dass dieses Plugin zwar von Haus aus funktioniert, es aber dennoch Einstellungen gibt, die Sie nach Ihren Bedürfnissen konfigurieren können. Auf der Ansicht des Editors für Beiträge können Sie die Qualität der Vorschaubilder für die Einbettung von YouTube-Videos auswählen.
Neben der Kurzmitteilung der Vorschaubilder gibt es weitere Optionen zur individuellen Anpassung.
Unter Einstellungen “ Langsames Laden für Videos können Sie diese Optionen überprüfen und neu einstellen.
Auf dem Tab „Allgemein/Styling“ können Sie das Aussehen der Vorschaubilder für Videos individuell anpassen. Sie können den responsiven Modus aktivieren, den Stil der Play Buttons auswählen, individuelle CSS verwenden und sogar schema.org-Markup
aktivieren.
Dieses Plugin unterstützt sowohl YouTube als auch Vimeo. Sie finden die anbieterspezifischen Einstellungen, indem Sie auf die jeweiligen Tabs klicken.
Auf dem Tab „YouTube“ können Sie die Farbe des Fortschrittsbalkens auswählen, Cookies deaktivieren, Anmerkungen ausblenden und vieles mehr. Sie können sogar das faule Laden für YouTube Videos deaktivieren.
In ähnlicher Weise können Sie auf dem Tab „Vimeo-Einstellungen“ die Kontrollfarben auswählen, den Videotitel ausblenden oder anzeigen und das träge Laden für Vimeo-Videos deaktivieren.
Wenn Sie Änderungen an diesen Einstellungen vorgenommen haben, vergessen Sie nicht, unten auf den Button „Änderungen speichern“ zu klicken, damit Ihr Fortschritt nicht verloren geht.
Bonus-Tipp: Niemals Videos auf WordPress hochladen
Bevor wir darauf eingehen, warum Sie das Hochladen von Videos auf Ihre WordPress Website vermeiden sollten, wollen wir den Unterschied zwischen Uploads und Einbettungen klären.
Das Hochladen eines Videos bedeutet, dass die Videodateien direkt auf Ihrer Website gespeichert werden, ähnlich wie Bilder in der WordPress Mediathek. Davon raten wir dringend ab.
Um ein Video einzubetten, muss es zunächst auf eine Website eines Drittanbieters wie YouTube hochgeladen werden. Anschließend betten Sie das Video in Ihren Blog ein, so dass es auf Ihrer Website angezeigt werden kann, während es an anderer Stelle gespeichert wird. Wir empfehlen dringend, Videos einzubetten, wann immer dies möglich ist.
Wenn Sie mehr über die Vorteile des Einbettens statt des Uploads von Videos in WordPress erfahren möchten, lesen Sie bitte unseren Leitfaden, warum Sie niemals ein Video in WordPress hochladen sollten.
Wir hoffen, dass dieser Artikel Ihnen geholfen hat, Lazy Load für Videos in WordPress hinzuzufügen. Als Nächstes sollten Sie sich unseren ultimativen Leitfaden für WordPress-Geschwindigkeit und -Leistung ansehen oder wie Sie eine WordPress-CDN-Lösung einrichten, um die Geschwindigkeit Ihrer Website zu erhöhen.
Wenn Ihnen dieser Artikel gefallen hat, dann abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Videotutorials. Sie können uns auch auf Twitter und Facebook finden.
Matt
Please update this article! I’m having a lot of trouble finding up to date information on how to achieve this
WPBeginner Support
We will certainly take a look at updating the article
Admin
Mike
What happens if you want to be playing your youtube videos in popups instead of on the page itself. Can you still use this plugin?
Ferret of chaos
I am running chrome with the pintrest plugin under linux and the video will not play. Even loading the image into a 2nd tab will not work. I am going to disable the plugin and see if the video will work. And negative, the video will still not play.
Rabbi Khan
Hi there I have a question about WordPress conditional tag. in my template displaying tags in post footer on WordPress homepage. So How to hide tags on home page. And display only on post page. Thanks in advance.
John
I have problem with this plugin. When I click on the image video starts play in thumbnail and under thumbnail too.
DebG.
So this plugin is responsive? It works with responsive themes?