Accentsconagua

Schneller Tipp Ihr eigener Videokurzcode

Code
Share

Sie verwenden wahrscheinlich ein Video-Einbettungs-Plugin oder Sie verwenden lediglich die Einbettungscodes von Videoseiten. Eine dritte, einfachere Möglichkeit, Videos in Ihre WordPress-Site einzubetten, ist ein einfacher (aber nützlicher) Video-Shortcode.

Warum sollte ich einen Video-Shortcode verwenden??

  • Weil Plugins für das Einbetten von Videos nur eine kleine Belastung für Ihr Blog darstellen. Sie benötigen etwas Speicherplatz auf Ihrer Festplatte (nicht mehr als 1 MB). Sie fragen Ihre Datenbank immer nach ihren Optionen ab, und Sie müssen dies tun lernen wie man die plugins benutzt.
  • Weil beim Einbetten die Codes der Videoseiten beschädigt werden können, insbesondere wenn Sie zwischen dem WYSIWYG-Editor und dem HTML-Editor wechseln.
  • Und vor allem: Weil Shortcodes super sind! Sie sind einfach zu verwenden, sie können die Funktionalität vieler Plugins haben und ihr Code bricht nicht in Ihren Posts!

Erkundung der Videoseiten

Wir werden mit 7 Video-Hosting-Sites arbeiten:

  1. YouTube (natürlich!)
  2. Vimeo
  3. Dailymotion
  4. Yahoo! Bildschirm
  5. Blip.tv
  6. Veoh
  7. Viddler

Mal sehen, wie ihre Einbettungscodes aussehen:

Youtube

Der standardmäßige Einbettungscode sieht folgendermaßen aus:

 / * Originalvideo: youtube.com/watch?v=dQw4w9WgXcQ * /

Es gibt jedoch eine Option, den "Privacy-Enhanced-Modus", der der Domäne "-nocookie" hinzufügt, und wir werden es in unserem Shortcode verwenden.

Vimeo

 / * Originalvideo: vimeo.com/36804448 * /

Einfach und elegant. Deshalb lieben die Menschen Vimeo.

Dailymotion

 / * Originalvideo: dailymotion.com/video/xhwpbg_bridgestone-15-sec-spot_auto * / 
BridgeStone 15 Sek von DailymotionUSA

Ich denke, das Hinzufügen eines Links unterhalb des Einbettungscodes ist einfach uncool, also fügen wir das nicht zu unserem shortcode hinzu.

Yahoo! Bildschirm

 / * Originalvideo: screen.yahoo.com/mysterious-death-of-500-fish-in-german-lake-blamed-on-urinating-swimmers-29322943.html * /

Der Einbettungscode ist auf Yahoo! etwas seltsam. Screen, aber ich habe einen Weg gefunden, ihn zu verkürzen, was in unserem Shortcode einfacher zu verwenden ist.

Blip.tv

 / * Originalvideo: blip.tv/mister-glasses/episode-7-5600357 * /

Dies ist eine schwierige Frage - diese enthält nicht die Video-ID (von der URL des Videos) im Einbettungscode. Aber dank einiger Nachforschungen habe ich herausgefunden, wie man die ID benutzt! :)

Veoh

 / * Originalvideo: veoh.com/watch/v27458670er62wkCt * / 
Intense Cat in Animals beobachten Mehr kostenlose Videos online bei Veoh.com

Ah, das tag… Keine Sorge, wir werden es nicht benutzen!

Viddler

 / * Originalvideo: viddler.com/v/978c9ba2 * /

Das ist alles. Kommen wir nun zum spaßigen Teil!

Der Kurzcode: [vid]

Wir erstellen 4 Attribute für diesen Shortcode - den Namen der Site, die ID des Videos sowie die Breite und Höhe des Videos. Sie können einige Standardwerte für die Attribute festlegen:

 Funktion vid_sc ($ atts, $ content = null) extract (shortcode_atts (array ('site' => 'youtube', 'id' => ", 'w' => '400', 'h' => '250 '), $ atts)); add_shortcode (' vid ',' vid_sc ');

Dann kommt der Teil, wo die Funktion das erzeugt $ src Variable, die das erzeugt src Attribut für die iframe:

 // YouTube mit "Privacy-Enhanced-Modus": if ($ site == "youtube") $ src = 'http://www.youtube-nocookie.com/embed/'.$id;  // Vimeo: else if ($ site == "vimeo") $ src = 'http://player.vimeo.com/video/'.$id;  // Dailymotion: else if ($ site == "dailymotion") $ src = 'http://www.dailymotion.com/embed/video/'.$id;  // Yahoo! Bildschirm mit einigen Kürzungen in der URI: else if ($ site == "yahoo") $ src = 'http://d.yimg.com/nl/vyc/site/player.html#vid='.$id ;  // Blip.tv mit einigen "Hacks" in der URI: else if ($ site == "bliptv") $ src = 'http://a.blip.tv/scripts/shoggplayer.html#file=http : //blip.tv/rss/flash/'.$id;  // Die Veoh-URI enthält auch einige Hacks: else if ($ site == "veoh") $ src = 'http://www.veoh.com/static/swf/veoh/SPL.swf?videoAutoPlay= 0 & permalinkId = '. $ Id;  // Viddler: else if ($ site == "viddler") $ src = 'http://www.viddler.com/simple/'.$id;

Und natürlich wir Rückkehr die Ausgabe. Hier ist der vollständige Code unseres brandneuen Video-Shortcodes:

 Funktion vid_sc ($ atts, $ content = null) extract (shortcode_atts (array ('site' => 'youtube', 'id' => ", 'w' => '600', 'h' => '370 '), $ atts)); if ($ site == "youtube") $ src =' http://www.youtube-nocookie.com/embed/'.$id; else if ($ site == "vimeo") $ src = 'http://player.vimeo.com/video/'.$id; else if ($ site == "dailymotion") $ src =' http: //www.dailymotion .com / embed / video /'.$ id; else if ($ site == "yahoo") $ src = 'http://d.yimg.com/nl/vyc/site/player.html#vid = '. $ id; else if ($ site == "bliptv") $ src =' http://a.blip.tv/scripts/shoggplayer.html#file=http://blip.tv/rss /flash/'.$id; else if ($ site == "veoh") $ src = 'http://www.veoh.com/static/swf/veoh/SPL.swf?videoAutoPlay=0&permalinkId=' . $ id; else if ($ site == "viddler") $ src = 'http://www.viddler.com/simple/'.$id; if ($ id! = ") return'';  add_shortcode ('vid', 'vid_sc');

Tipp im Schnelltipp: Beachten Sie, dass die iframe hat zwei CSS-Klassen: vid und iframe- $ site (z.B. iframe-youtube). Sie sollten hinzufügen vid border: 0; in Ihre CSS-Datei, da wir das nicht definiert haben Bilderrandbereich Attribut in unserem iframe Etikett.

Anwendungsbeispiele

Die Standardeinstellung ist einfach genug:

[vid site = "youtube" w = "600" h = "340"]

Aber um es gleich zu machen einfacher, Wir setzen Standardwerte für Seite? ˅, w und h. Wenn Sie ein YouTube-Video einbetten möchten, können Sie es einfach wie folgt verwenden:

[vid]

Sie sollten die Breite und Höhe ändern, um sie Ihrem Blog anzupassen. Wenn Sie Vimeo mehr als YouTube verwenden, können Sie auch die Standardeinstellung ändern Seite? ˅ Wert auf "Vimeo".

Das ist es! Fügen Sie dies Ihrem hinzu Functions.php Datei und Sie können den Kurzcode verwenden. Genießen!

Update: Wir haben dem Artikel jetzt einen Abschnitt mit Verwendungsbeispielen hinzugefügt, um die Dinge klarer zu machen.

Code
×