JGU Videos: diverse Videoformate abspielen

Fügen Sie Videos im Texteditor hinzu.

Diese Shortcodes binden Videos von Streaming-Servern ein

Streaming Media ist eine Technologie, um Multimedia-Daten (z.B. Audio- und Video-Daten) auf Web-Seiten zum Direktabruf zur Verfügung zu stellen. Dadurch wird der Zeitaufwand vermieden, der ansonsten für das Herunterladen der in der Regel recht großen Multimedia-Dateien entstehen kann.

Der Standard-Shortcode video von WordPress steht Ihnen zusätzlich zur Verfügung. Damit können Sie Videos, die über den Medien-Manager in Ihrem Projekt hochgeladen werden, in die Seite einbinden.

Weitere Infos zu dieser Funktionalität finden Sie auf der WordPress Dokumentation zum Video Shortcode.

Panopto Videos einfach per Link einbauen

Kopieren Sie die Panopto-Video URL. So sieht das zum Beispiel aus:

https://video.uni-mainz.de/Panopto/Podcast/StreamInBrowser/f1029ced-4f56-4638-9dd0-047f27a92fb9.mp4

und fügen Sie diese im WordPress-Editor ein. Direkt nach dem Speichern der Seite wird Ihnen statt der Adresse das Video im Player angezeigt und auch auf der Seite für die Benutzer dargestellt.

 

Panopto Videos per Shortcode einbauen

Der Shortcode [jgupanopto] kann verwendet werden, um Videos der neuen Streaming-Plattform Panopto in die WordPress-Seite einzubinden. Über den Shortcode können weitere Parameter genutzt werden (siehe unten), die bei der Einbindung per Link nicht zur Verfügung stehen.

Beispiel:

[jgupanopto panopto_id="f1029ced-4f56-4638-9dd0-047f27a92fb9"]

Wie finde ich die Panopto-ID des gewünschten Videos?

Ganz einfach: Kopieren Sie die Panopto-Video URL. So sieht das zum Beispiel aus:

https://video.uni-mainz.de/Panopto/Podcast/StreamInBrowser/f1029ced-4f56-4638-9dd0-047f27a92fb9.mp4

Für den Shortcode benötigen Sie nur die Panopto-id, in dem Beispiel ist das: f1029ced-4f56-4638-9dd0-047f27a92fb9

Kopieren Sie nun den folgenden Shortcode in Ihre Seite:

[jgupanopto panopto_id="dieshierdurchdieidersetzen"]

Ersetzen Sie dieshierdurchdieidersetzen  durch die Panopto-ID, speichern Sie und probieren Sie es aus.

 

Der Shortcode kann über die folgenden Parameter angepasst werden:

  1. Parameter: panopto_host
    Funktion: URL des Panopto-Servers (benötigen Sie standardmäßig nicht)
    Standard: video.uni-mainz.de
    Beispiel: [jgupanopto panopto_host="video.hs-mainz.de"] - hiermit könnten Sie Videos des Panopto-Servers der Hochschule Mainz einbinden
  2. Parameter: max-width
    Funktion: maximale Breite des Video-Fensters festlegen (Wert in Pixeln)
    Beispiel: [jgupanopto max-width="300"]
  3. Parameter: ratio
    Funktion: Verhältnis Breite zu Höhe für die Darstellung des Video-Fensters
    Mögliche Werte: 16x9 (Standard), 4x3
    Beispiel: [jgupanopto ratio="4x3"]

>> Mehr zu Panopto und Videos in WordPress einbauen

YouTube-Videos einfügen

Fügen Sie ein YouTube-Video ein, indem Sie in Anführungszeichen die Webadresse des gewünschten Videos schreiben:

Beispiel:
[jguvideo url="http://www.youtube.com/watch?v=9KkHur8NMJM"]

Und so sieht das auf der öffentlichen Seite aus:

Höhe und Breite eines Videos (optional)

Schreiben Sie nach der url den Befehl: w="" für die Breite und/oder h="" für die Höhe. In die Anführungszeichen schreiben Sie dann die jeweils gewünschte Pixelzahl.

Vorschaubild: Attribut image (optional)

Achten Sie darauf, dass Film und Bild die geichen Größendimensionen besitzen. Image muss die vollständige URL des Bildes enthalten.

Fügen Sie z.B. das Bild über "Dateien hinzufügen - hochladen" hinzu. Sie sehen dann das Bild in der Medienvorschau angehakt. Rechts bei "Dateianhang / Anzeigeneinstellung" finden Sie die  Adresse des Bildes, die Sie mit strg-c in den Zwischenspeicher kopieren. Haken Sie dann das Bild aus und schließen Sie das "Dateien hinzufügen"-Fenster. Erweitern Sie nun den Shortcode um image="Adresse aus dem Zwischenspeicher strg-v", also zb

image="//www.blogs.uni-mainz.de/wp-content/uploads/2012/03/startbild.gif"

Beispiel-Shortcode

Allgemein:

[jguvideo url="http://www.youtube.com/watch?v=id-des-youtube-videos" w="123" h="123" image="http://www.pfad-zur-bild/datei.jpg"]