ONE DOCS

Audio- und Videoinhalte im Homepage-Baukasten einbetten

Wenn Sie Audio- und Videoinhalte nicht bei einen Drittdienst wie z.B. SoundCloud oder YouTube hochladen möchten, sondern auf Ihrem Webspace hochladen und im Homepage-Baukasten anbieten möchten, unterstützt Sie diese Anleitung bei Ihrem Vorhaben.

Was muss ich im Vorfeld wissen?

Medien hochladen

Laden Sie Ihre Audio- oder Videodatei zunächst per SFTP, FTP oder File Manager hoch.

Der Vorteil bei der Nutzung des File Managers ist, dass in den Dateiinformationen die Adresse zur Datei direkt sichtbar ist.

Vollständiger Pfad im File Manager

Diesen vollständigen Pfad werden Sie in Schritt 3 benötigen, um den Audio- oder Videoinhalt auf Ihrer Homepage zu platzieren.

Achtung
Sollten Sie https für Ihre Website erzwungen haben, müssen Sie im Pfad selbst http durch https austauschen! Andernfalls kann Ihr Browser die Mediendatei blockieren.

Medien im Homepage-Baukasten einbinden

Sobald Sie die Datei hochgeladen haben, gehen Sie wie folgt vor:

  1. Öffnen Sie den Homepage-Baukasten und wechseln ggf. zur gewünschten Unterseite.

  2. Ziehen Sie eine Code-Komponente auf die gewünschte Stelle:

Code-Komponente platzieren

  1. Nun erscheint ein Fenster zur Eingabe des Codes. Je nachdem, was für eine Mediendatei Sie einbinden möchten, müssen Sie einen der folgenden Codes einsetzen.
Achtung
Ersetzen Sie PFAD durch den vollständigen Pfad von vorhin!

Für Audiodateien:

<audio controls>
<source src="PFAD" type="audio/mpeg">
</audio>

Für Audiodateien, die automatisch abgespielt werden sollen:

<audio controls autoplay>
<source src="PFAD" type="audio/mpeg">
</audio>

Für Videodateien:

<video width="640" height="480" controls>
<source src="PFAD" type="video/mp4">
</video>

Für Videodateien, die automatisch abgespielt werden sollen:

<video width="640" height="480" controls autoplay>
<source src="PFAD" type="video/mp4">
</video>
Tipp
Die Video-Codes geben, wenn Sie genau hinschauen, eine Auflösung von 640x480 Pixeln vor. Die Werte für die Breite und Höhe können Sie bei Bedarf anpassen.

Sie können nun in der Vorschau überprüfen, ob die Mediendatei korrekt eingebunden wurde:

Katzenvideo im Homepage-Baukasten

Weitere Hinweise


  1. Dieses Verfahren unterscheidet sich von dezidierten Audio- und Videoplattformen wie z.B. SoundCloud oder YouTube, die Mediendateien optimal codieren und einen komplexeren Code zum Einbinden bereitstellen.