Hinzufügen von Miniaturansichten für YouTube-Videos in WordPress

Hinzufügen von Miniaturansichten für YouTube-Videos in WordPress / WordPress-Plugins

Haben Sie beliebte Websites mit ihren YouTube-Video-Thumbnails auf der Startseite ihrer Website gesehen? Wenn Sie einen Videokanal auf Websites wie YouTube, Vimeo oder anderen Websites ausführen, können Sie auch ein Video-Miniaturbild für alle Beiträge mit Videos auf der Vorder- und Archivseite Ihres Blogs anzeigen. In diesem Artikel zeigen wir Ihnen, wie Sie Thumbnails für YouTube-Videos in WordPress hinzufügen.

Video-Miniaturansichten und WordPress-Post-Miniaturansichten

WordPress verfügt über integrierte Funktionen zum Hinzufügen von Bildern oder Posten von Miniaturansichten. Die meisten WordPress-Designs unterstützen diese Funktion. Wenn Sie jedoch Ihren Videocontent in YouTube hervorheben möchten, möchten Sie diesen Inhalt mit Video-Miniaturansichten präsentieren. Dieser Artikel hilft Ihnen dabei, indem Sie die Standard-Miniaturansicht von WordPress verwenden.

Einrichten des Video-Miniaturen-Plugins in WordPress

Als erstes müssen Sie das Plugin Video Thumbnails installieren und aktivieren. Nachdem Sie das Plugin aktiviert haben, müssen Sie zu gehen Einstellungen »Video-Thumbnails um die Plugin-Einstellungen zu konfigurieren.

Es wird empfohlen, auf dem Einstellungsbildschirm die Miniaturansicht in Ihrer Medienbibliothek zu speichern. Dadurch werden externe HTTP-Anforderungen auf Ihrer Site reduziert, und Ihre Seiten werden schneller geladen. Unter dem Abschnitt Posttypen zeigt das Plugin Posts, Seiten und benutzerdefinierte Posttypen an, sofern Sie welche auf Ihrer Website haben. Wählen Sie die Beitragstypen aus, die das Plugin nach Videolinks durchsuchen soll. Die letzte Option auf dieser Seite besteht darin, ein benutzerdefiniertes Feld auszuwählen. Einige Video-Plugins für WordPress speichern Video-URLs in einem benutzerdefinierten Feld. Wenn Sie solche Plugins verwenden, müssen Sie dieses benutzerdefinierte Feld hier eingeben. Danach klicken Sie auf die Schaltfläche Änderungen speichern.

Auf der Einstellungsseite wird auch das angezeigt Anbieter Tab. Wenn Sie Vimeo zum Freigeben Ihrer Videos verwenden, müssen Sie eine App in Vimeo erstellen und dann die Client-ID, das Client-Secret, das Zugriffstoken und die geheimen Werte für das Zugriffstoken eingeben.

Auf der Massenaktionen Auf dieser Registerkarte können Sie Ihre veröffentlichten Beiträge nach Videos durchsuchen und Video-Miniaturansichten für sie erstellen. Das Plugin bietet auch eine Schaltfläche, um alle Video-Miniaturansichten zu löschen und als Anhang aus Ihren Posts zu entfernen.

Erstellen von Video-Miniaturansichten in WordPress-Posts

Nachdem Sie das Plugin eingerichtet haben, erstellen Sie ein Video-Miniaturbild, indem Sie in einem WordPress-Beitrag eine Video-URL hinzufügen. Dazu müssen Sie einen WordPress-Beitrag erstellen oder bearbeiten und Ihre Video-URL im Nachbearbeitungsbereich hinzufügen. Sobald Sie den Post veröffentlicht haben, werden Sie sehen, dass das Plugin ein Video-Miniaturbild für Sie erstellt und Ihrem Post hinzugefügt hat.

Anzeigen eines Video-Miniaturbilds in Ihrem WordPress-Theme

Das Plugin für Video-Miniaturansichten verwendet die WordPress-Funktion "Post-Miniaturansichten". Die meisten WordPress-Themes sind so eingestellt, dass Post-Miniaturbilder automatisch angezeigt werden. Dies bedeutet, dass Ihr Design die Video-Miniaturansicht automatisch zusammen mit Ihrem Post-Inhalt oder einem Ausschnitt anzeigt. Wenn jedoch die Miniaturansichten des Videos nicht in Ihrem Design angezeigt werden, müssen Sie die Designdateien bearbeiten und diesen Code der Vorlage hinzufügen, in der Sie die Miniaturansicht anzeigen möchten.

  

Hinzufügen einer Wiedergabeschaltfläche zum Video-Thumbnail in WordPress

Nachdem Sie nun erfolgreich Video-Miniaturen in Ihren WordPress-Beiträgen aufgenommen und angezeigt haben, möchten Sie möglicherweise Ihre regulären Miniaturbilder von Ihren Video-Miniaturen unterscheiden. Dadurch werden Ihre Benutzer darüber informiert, dass sich im Beitrag ein Video befindet, und sie können auf die Wiedergabeschaltfläche klicken, um den Video-Beitrag anzuzeigen. Wir zeigen Ihnen, wie Sie bedingte Tags verwenden, um zwischen Video-Miniaturansichten und normalen Miniaturbildern zu unterscheiden und eine Wiedergabeschaltfläche hinzuzufügen.

Um diese Methode verwenden zu können, müssen Sie sicherstellen, dass Sie Ihre Video-Beiträge in einer bestimmten Kategorie veröffentlichen, z. B. Videos. Dann in die Vorlagendateien Ihres Themas wie index.php, archive.php, category.php oder content.php Suchen Sie nach dieser Codezeile:

  

Jetzt müssen wir diesen Code durch folgenden Code ersetzen:

      

Dieser Code fügt hinzu nach dem Postminiaturbild nur für Beiträge, die in der Videokategorie abgelegt wurden Der nächste Schritt ist das Hochladen einer Bilddatei von Medien »Neu hinzufügen Bildschirm. Dieses Bild wird als Wiedergabetaste verwendet. Nachdem Sie die Bilddatei hochgeladen haben, notieren Sie sich den Speicherort der Bilddatei, indem Sie auf klicken Bearbeiten Link neben dem Bild.

Der letzte Schritt ist das Anzeigen der Wiedergabetaste. Wir verwenden CSS, um die Wiedergabeschaltfläche auf der Video-Miniaturansicht anzuzeigen und zu positionieren. Dazu müssen Sie diesen CSS-Code kopieren und in Ihr Stylesheet des untergeordneten Themes einfügen, indem Sie auf klicken Aussehen »Editor.

 .playbutton background: url ('http://example.com/wp-content/uploads/playbutton.png') center center no-repeat; Position: absolut; Spitze: 50%; links: 50%; Breite: 74px; Höhe: 74px; Marge: -35px 0 0 -35px; z-Index: 10; Deckkraft: 0,6;  .playbutton: hover Deckkraft: 1.0;  

Vergessen Sie nicht, die Hintergrundbild-URL durch die URL der zuvor hochgeladenen Bilddatei der Wiedergabeschaltfläche zu ersetzen. Das ist alles. In Ihren Video-Miniaturbilddateien sollte jetzt eine Wiedergabetaste angezeigt werden.

Wir hoffen, dass dieser Artikel Ihnen geholfen hat, Ihre YouTube-Videos mit Miniaturbildern in WordPress hervorzuheben. Für Feedback und Fragen hinterlassen Sie bitte einen Kommentar oder folgen Sie uns auf Twitter.