Möchten Sie herausfinden, wie Sie ein YouTube-Video in einem Popup in WordPress öffnen?

La Leuchtkasten oder modales Fenster (Popup) ist eine sehr häufige Funktion im Netz. Es wird jedoch im Allgemeinen verwendet, um Bilder, E-Mail-Erfassungsformulare, Werbeaktionen oder sogar Registrierungsformulare anzuzeigen. 

Aber wussten Sie, dass es auch möglich ist, Videos anzuzeigen? WordPress ? Nicht? 

Keine Sorge, in diesem Tutorial zeige ich Ihnen, wie Sie ein Video anzeigen (YouTube – Vimeo – usw.) in ein Leuchtkasten.

Aber vorher, wenn Sie WordPress Discover noch nie installiert haben Wie man ein Wordpress-Blog 7 Schritte für die Installation et Wie finden, zu installieren und ein Wordpress-Theme auf Ihrem Blog aktivieren 

Dann zurück zu warum wir hier sind.

Die Gründe, warum Sie a verwenden sollten Leuchtkasten, um Ihre Videos anzuzeigen 

Die Leuchtkasten Es handelt sich jedoch um modale Fenster. Sie wissen jedoch nicht, dass nicht alle darin angezeigten Bilder während des Fensters geladen werden « Laden«  Seite. 

Le Navigateur berechnen die Bilder wenn der Leuchtkasten geöffnet wird, ist dies auch bei Videos der Fall. Kurz gesagt, es ist eine Funktion, die Dadurch können Ihre Seiten schneller geöffnet werden. Sie können damit auch die Größe reduzieren (longueur) Ihrer Seiteweil ein Teil des Inhalts dieser Seite in diesem modalen Fenster verfügbar sein wird.

Waffenstillstand, lasst uns zur Sache kommen.

Wie installieren und konfigurieren Plugin WP Video Leuchtkasten

WP Video Lightbox ist ein Plugin verfügbar bei WordPress.org. Das heißt, Sie können es direkt von Ihrem WordPress-Dashboard aus installieren oder Laden Sie es herunter als ZIP-Datei.

Für weitere Informationen, Lesen Sie unsere Schritt-für-Schritt-Anleitung zur Installation eines WordPress-Plugins.

Nach dem Aktivieren der Plugin, gehe von diesem Ort zu seiner Einstellungsseite " Einstellungen >> Video Leuchtkasten ".

Wir werden direkt zum " schönes Foto ".

In Wirklichkeit ist dies Plugin benutze einen anderen Plugin, der hauptsächlich zum Anzeigen einer Fotogalerie gedacht ist. Sie können jedoch einige der Informationen ändern, die auf Videos angewendet werden.

Dazu erkläre ich einige Optionen (Erforderlich)Damit ist es, wie Sie wollen.

Schon die Buchhandlung schönes Foto muss aktiviert werden (check « Ermöglichen schönes Foto »)Um Benutzer darüber zu informieren, dass sie sich auf derselben Seite befinden, können Sie das Fenster transparent machen (definieren ein Wert von 0 bis 1. Komma-Werte werden akzeptiert).

Entdecken Sie Die Eigenschaften eines effektiven Popups für WordPress 

Alle Ihre Leuchtkästen können einen Titel haben, der angezeigt werden kann (Anzeigen Titel). Manchmal müssen Sie bei großen modalen Fenstern die Größenänderung zulassen (Erlauben Größe). Und für längere Videos können Benutzer sie vergrößern (Erlauben Erweitern Sie die Funktionalität der), Bessere Optik.

Für die Breite und Höhe der Leuchtkastenkönnen Sie die Felder bearbeiten " Standard Breite "Und" Standard Höhe ". 

So wählen Sie das Thema der Leuchtkasten, ändern Sie das Dropdown-Menü Thema ". Es ist auch möglich, die automatische Wiedergabe zu aktivieren (kreuze das Kästchen an " Autoplay ").

Öffne ein Youtube-Video in einem Popup - define-les-regalges

So zeigen Sie ein Leuchtkasten in einem Artikel

Le Plugin schlägt eine Liste von Kurzwahlnummern Damit können Sie anzeigen Leuchtkasten in Artikeln. Ich habe vergessen Ihnen zu sagen, dass Sie auch die verfügbaren Videos anzeigen können Vimeo.

So zeigen Sie ein Video an YouTube ou Vimeodu musst das benutzen Kurzwahlnummern folgende:

[video_lightbox_youtube] (pour YouTube)
[video_lightbox_vimeo5] (pour Vimeo)

Jeder von diesen Kurzwahlnummern akzeptiert Parameter, mit denen Sie:

  • Definieren Sie die Kennung (video_id) eines Videos, normalerweise in diesem Format " YzqKMmQ_3Sg ". Beispiel [video_lightbox_youtub video_id = "YzqKMmQ_3Sg"]
  • Stellen Sie die Höhe des Videos ein (Höhe)
  • Stellen Sie die Breite des Videos ein (Breite)
  • Fügen Sie eine Beschreibung (Beschreibung)
  • Fügen Sie einen HTML-Anker hinzu (Anker) oder Text des Links, der das Fenster öffnet
  • Fügen Sie ein Miniaturbild hinzu (auto_thumb)

Wenn Sie einen HTML-Anker setzen, wird die Miniaturansicht ignoriert. Ansonsten auto_thumb nimmt den Wert " 1 ".

Gehen Sie weiter, indem Sie auch entdecken Wie verwenden und verwalten Wordpress Shortcodes

Demo einer Nutzung

Mit den Informationen, die ich Ihnen gerade zur Verfügung gestellt habe, können Sie ein Video mit einem ähnlichen Code anzeigen:

[video_lightbox_youtube video_id="YzqKMmQ_3Sg&rel=0width="640height="480anchor="Une simple vidéo" description="Par Dr WP"]

Für ein ähnliches Ergebnis

Präsentation-for-Ergebnisse

Sie können eine Miniaturansicht wie oben gezeigt mit einem ähnlichen Code anzeigen.

[video_lightbox_youtube video_id="YzqKMmQ_3Sg&rel=0width="640height="480auto_thumb="1description="Par Dr WP"]

Für ein Ergebnis wie dieses

Miniatur-Düne-Video

Vor dem verlassen

Es ist zu beachten, dass einige Parameter in der Kurzwahlnummern überschreibt die in den Einstellungen definierten Werte.

Entdecken Sie auch einige Premium-WordPress-Plugins  

Sie können andere verwenden Wordpress-Plugins um ein modernes Erscheinungsbild zu geben und die Handhabung Ihres Blogs oder Ihrer Website zu optimieren.

Wir bieten Ihnen hier einige Premium-WordPress-Plugins an, die Ihnen dabei helfen werden.

1. FileBird

DateiBird

Hatten Sie jemals Probleme, Tausende von Bild-, Video- oder Dokumentdateien zu verwalten, die Sie auf Ihr WordPress-FTP hochgeladen haben? ja oder nein, egal, wichtig ist zu wissen, dass die WordPress Plugin FileBird hilft Ihnen dabei, Ihre Mediendateien einfach zu verwalten und bringt mehr Leistung in Ihre Bibliothek.

Dank der nahtlosen Benutzeroberfläche und des Kontextmenüs können Benutzer Dateien in Ordner ziehen und ablegen oder verfügen über die erforderlichen Rechte, um Ordner auf die gleiche Weise wie auf Ihrem Computer schnell zu erstellen, umzubenennen oder zu löschen. Mit diesem Plugin werden Ihre Mediendateien systematisch organisiert und Sie können ganz einfach ein Bild auswählen, das in eine Seite eingefügt oder veröffentlicht werden soll.

Entdecken Sie auch unsere 6 WordPress-Plugins, um Ihren Artikeln neues Leben einzuhauchen

Darüber hinaus ist dieses Plugin vollständig kompatibel mit den gängigsten Plugins, insbesondere mit WooCommerce, und unterstützt auch eine große Anzahl von Sprachen. Wenn Sie also Ihrer Medienbibliothek einen Schub geben möchten, ist die WordPress Plugin FileBird könnte Ihre Geheimwaffe sein.

HerunterladenDemo Web-Hosting

2. Social Share & Locker Pro

Das Social Share & Locker Pro-Plugin wurde entwickelt, um Ihre Website in sozialen Netzwerken besser sichtbar zu machen. Mit nur wenigen Klicks können Sie entweder die Position Ihrer sozialen Symbole festlegen oder Ihre Inhalte sperren, indem Sie die Freigabe in einem der von Ihnen angebotenen sozialen Netzwerke verlangen.

Social Share Locker Pro WordPress-Plugin

Sie haben 10 Vorlagen, die die häufigsten Wünsche abdecken sollen. Alle Modelle sind perfekt und funktionieren wunderbar. Mit Social Share & Locker Pro können Sie außerdem den vollständigen Namen der sozialen Netzwerke oder nur das Symbol anzeigen. Dies hängt von Ihrem Design, dem verfügbaren Platz oder Ihrem Geschmack ab.

Herunterladen | Demo | Web-Hosting

3. Kontaktformular 7 Tooltips

diese WordPress-Plugin des Contact Form 7-Plugins bringt eine einfache Tooltip-Funktionalität in Ihr Contact Form 7-Plugin, dessen Tooltips angezeigt werden, wenn der Mauszeiger über das Zielelement bewegt wird. Auf mobilen Geräten zeigen Tooltips an, wenn das Zielelement aktiviert ist.

Kontaktformular 7 Tooltips

Die Hauptmerkmale sind: Benutzerfreundlichkeit, Unterstützung für alle Versionen von Contact Form 7, Anpassung der Hintergrundfarbe des Tooltips, Unterstützung für HTML-Code, vollständiges Layout reaktionsschnell und mehr.

Herunterladen | Demo | Web-Hosting

Andere empfohlene Ressourcen

Wir laden Sie außerdem ein, die unten aufgeführten Ressourcen zu konsultieren, um die Kontrolle und Kontrolle Ihrer Website und Ihres Blogs zu verbessern.

Zusammenfassung

Es! Das wars für dieses Tutorial, hoffe es hilft dir, Youtube- oder Vimeo-Videos in einem anzuzeigen Leuchtkasten auf Ihrer WordPress-Website. Zögere nicht zu Teile es mit deinen Freunden in deinen bevorzugten sozialen Netzwerken

Sie können jedoch auch unsere RessourcenWenn Sie mehr Elemente benötigen, um Ihre Projekte zur Erstellung von Internetseiten durchzuführen, konsultieren Sie unseren Leitfaden auf der WordPress-Blog-Erstellung.

Aber erzählen Sie uns in der Zwischenzeit von Ihrem commentaires und Vorschläge im entsprechenden Abschnitt.

...