Kleiner Bildteaser

Erstellen eines Kleinen Bildteasers

1. Erstellen Sie einen neuen Ordner der Vorlage UHH Homepage 2025 oder wechseln Sie in einen bereits vorhandenen Ordner dieser Vorlage.
2. Legen Sie unterhalb des o. g. Ordners einen neuen Ordner der Vorlage Ordner für Boxen (Name "_boxes") an oder wechseln Sie in einen bereits bestehenden Ordner dioeser Vorlage.
3. Legen Sie ein neues Dokument der Vorlage Kleiner Bildteaser unterhalb des Boxen-Ordners an.

Eigenschaften der Vorlage

Pflichtangaben sind mit einem Stern (*) gekennzeichnet.

Dateiinfo

Name *	Der Name dieses Dokuments in FIONA. Er taucht in der URL der freigegebenen Seite auf. Nicht zu verwechseln mit dem Titel.
Vorlage *	Die Vorlage dieses Dokuments.

Inhalte

Überschrift *	Wird als Ebene-2-Überschrift über dem Teasertext bzw. über dem Bild bzw. Video platziert.
Teasertext *	Ein kurzer Text, der neben bzw. unter dem Bild bzw. Video platziert wird.
Bild Desktop (960x497px) *	Ein Bild, welches neben bzw. unter der Überschrift platziert wird, bei passender Fenster-Größe des Browsers. Dient als Vorschau für das Video.
Bild Tablet (800x414px) *
Bild Mobil (640x320px) *
Links	Ein Link zu einer weiterführenden Seite, der als Button unter dem Teasertext platziert wird.
Ausrichtung *	Hier können Sie auswählen, ob das Bild bzw. Video links von der Überschrift und dem Teasertext platziert werden soll, oder rechts davon. hat nur bei ausreichender Fenster-Breite auswirkungen auf die Darstellung. bei schmalen Viewports wird das Bild bzw. Video unter der Überschrift und über dem Teasertext platziert.
Stil *	Hintergrundfarbe des Teasers
Video	Hier können Sie ein Video mittels Einbettungs-URL in den Teaser einbinden. Das Bild dient dann als Vorschau für das Video, welches mit einem Klick abgespielt werden kann.

Felder

Titel	Der Titel dieser Box. Wird bei dieser Vorlage nich ausgegeben. Verwenden Sie stattdessen die Überschrift.
Hauptinhalt	Inhalt der Box. Wird bei dieser Vorlage nicht verwendet. Nutzen Sie stattdessen die Eigenschaften Teasertext, Bild, Links und Video
Gültig ab	Gibt an, ab wann diese Box gültig ist. Ungültige Boxen werden nicht auf Seiten angezeigt, auch nicht in der Vorschau.
Gültig bis	Gibt an, bis wann diese Box gültig ist. Wenn Sie dieses Dokument in FIONA deaktiviert haben, können Sie es wieder aktivieren, indem Sie den Wert dieser Eigenschaft löschen.
Dateiendung	Die Dateiendung des Hauptinhalts dieses Dokuments. Wird beim Herunterladen des Hauptinhalts berücksichtigt.
Position im Menu	Die relative Position dieser Box auf der Seite. Je niedriger der Wert, desto weiter oben wird sie angezeigt.

Diese Vorlage ermöglicht es, ein Video einzubinden, welches bei einem Klick auf das Bild abgespielt wird.

Dazu benötigen Sie eine Einbettungs-URL eines Lecture2Go- oder YouTube-Videos, die Sie dann als Wert der Eigenschaft Video nutzen:

Lecture2Go

Suchen Sie im Katalog das gewünschte Video und kopieren Sie dann die URL aus dem Feld "IFrame Link (Fiona)" im Bereich "Teilen" unter der Video-Beschreibung. Die URL sollte dem Schema https://lecture2go.uni-hamburg.de/o/iframe/?obj=video-id folgen wobei video-id durch die jeweilige ID des Videos zu ersetzen ist.

YouTube

Rufen Sie das gewünschte Video auf der Plattform auf, klicken Sie dann auf den Button "Teilen" unter dem Video und wählen SIe dann die Option "Einbetten". Nun bekommen Sie einen längeren HTML-Code angezeigt, der ungefähr so aussieht:

<iframe width="560" height="315" src="https://www.youtube.com/embed/video-id?si=share-id" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>

Kopieren Sie daraus nur die URL, welche in dem src-Attribut hinterlegt ist, also im obigen Beispiel https://www.youtube.com/embed/video-id, wobie video-id durch die ID des Videos zu ersetzen ist.