Anwendungsbeispiel H5P Inhalte einbetten
H5P- Inhalt einbetten
Um einen online verfügbaren H5P-Inhalt auf einer internen Seite einzubetten, gehen Sie wie folgt vor:
Öffnen Sie den Texteditor im Kursbaustein Einzelne Seite, zu der Sie den Inhalt einbetten möchten. Dies ist über die Kursansicht oder den Kurseditor möglich. Wählen Sie den Eintrag Einfügen im Werkzeugbereich des Texteditors. Es öffnet sich eine Liste. Klicken Sie hier auf die Auswahloption Video einfügen.
Im sich öffnenden Dialog wählen Sie den angezeigten Reiter Einbetten. Tragen Sie dort Ihren Einbettungscode in das Textfeld ein.
<iframe src=" [ URL zur pdf-Datei ] " width="800" height="1000" [ weitere Attribute ]></iframe>
Passen Sie im Einbettungscode den Link zur H5P Inhalt an.
Für das Beispiel wird der Inhalt https://h5p.org/h5p/embed/128863 genutzt. Der minimale Einbettungscode lautet demnach:
<iframe src="https://h5p.org/h5p/embed/440740" width="800" height="1000"></iframe>
Der Einbettungscode kann auch am H5P-Inhalt selbst kopiert werden. Wählen Sie dazu den Link "<>Embed" unter dem Beispielinhalt. In einem kleinen Fenster wird der Einbettungscode angezeigt. Dieser enthält zusätzliche Funktionen und lautet:
<iframe src="https://h5p.org/h5p/embed/128863" width="1090" height="639" frameborder="0" allowfullscreen="allowfullscreen" allow="geolocation *; microphone *; camera *; midi *; encrypted-media *" title="Course Presentation"></iframe><script src="https://h5p.org/sites/all/modules/h5p/library/js/h5p-resizer.js" charset="UTF-8"></script>
Bei Bedarf können Sie die Größe auch nachträglich im Reiter Allgemein anpassen. Schließen Sie den Dialog mit Klick auf den Button OK.
Anschließend wird ein Platzhalter mit dem H5P-Inhalt im Textbereich angezeigt. Speichern Sie Ihre Seite mit Klick auf den Button Speichern und Schließen.
Die Editoransicht wird geschlossen und Sie sehen in der Kursansicht den PDF-Inhalt auf der angezeigten Seite.
