Versionen im Vergleich

Version Alte Version 57 Neue Version Aktuell
Änderungen wurden vorgenommen von

Stefan Renneke

Igor Seifert

Gespeichert am

Schlüssel

  • Diese Zeile wurde hinzugefügt.
  • Diese Zeile wurde entfernt.
  • Formatierung wurde geändert.

YouTube-Video/Stream

Überblick

Name

contentclass-snippet.gifYouTube-Video/Stream

Ordner

folderopen.gif Social Media Inhalts- und Marginalspalten - Templates

Styleguide

https://www.styleguide.sachsen.de/video-4058.html

Inhaltsverzeichnis

Inhalt
minLevel1
maxLevel34
outlinefalse
stylenone
typelist
printabletrue

1. Einleitung

Mit Hilfe dieses Inhalts-Elements des Seiteninhalts YouTube-Video können im OpenText Video-Inhalte auf der Seite eingebunden werden. Das Einbinden eines YouTube- Videos auf der Webseite kann die Nutzererfahrung (UX) verbessern und das Inhalts-Angebot bereichern.
Sind für ein Thema Bewegtbildinformationen vorhanden, so empfiehlt sich grundsätzlich diese zu integrieren und dem Nutzer damit unterstützende Formate zur Verfügung zu stellen. Auf diese Weise werden die i.d.R. sehr textlastige Inhalte um diese zusätzliche Ebene erweitert.

Panel
panelIconId1f5a5
panelIcon:desktop:
panelIconText🖥️
bgColor#EAE6FF

2. Verschiedene Darstellungsmöglichkeiten

youtube_einzelelement.pngImage Removedyoutube_einzelelement.pngImage Added

2.1 YouTube als

Einzelelement

einzelner Seiteninhalt

Ein YouTube Video kann an verschiedenen Stellen im Inhaltsbereich der Seite verwendet werden. Je nach Seitenaufteilung (mit oder ohne Marginalspalte), variiert aber die Breite der Darstellung.
In der Beispielabbildung ist die Seitenaufteilung “Navigation-Inhalt breit” (ohne Marginalspalte) gewählt.

Info

Siehe dazu Kapitel 7.

youtube_teaserbox.pngImage Removed

YouTube als Element in einem Teaserboxen-Container

Je nach Seitenaufteilung (mit oder ohne Marginalspalte), variiert die Breite der Darstellung.
In der Beispielabbildung ist die Seitenaufteilung “Navigation-Inhalt breit” (ohne Marginalspalte) gewählt.
Bei der Anordnung der YouTube-Elemente kann zwischen 2 oder 3 spaltigen Layout gewählt werden

6 Marginalinhalte in der Marginalspalte und Kapitel Auswahl der Seitenaufteilung

youtube_teaserbox.pngImage Added

2.2 YouTube als Seiteninhalt in einem Boxenbereich

YouTube Videos können auch als Boxeninhalt des Boxenbereichs verwendet werden und können dann beispielsweise auch als ein Teaser genutzt werden. Auch hier ist die Breite der Darstellung abhängig von der Seitenaufteilung der gesamten Seite.

YouTube als Element

Info

Siehe dazu Kapitel Teaserboxen-Container

youtube_marginalspalte.pngImage Removed

Boxenbereich und Kapitel Auswahl der Seitenaufteilung

youtube_marginalspalte.pngImage Added

2.3 YouTube als Seiteninhalt in der Marginalspalte

Ist die Seite in ein 3-spaltiges Layout aufgeteilt, kann das YouTube-Element auch in der Marginalspalte verwendet werden. Die Breite der Darstellung ist dann an die der Marginalspalte entsprechend ausgerichtet.

Info

Siehe dazu Kapitel Die Marginalspalte (Randspalte) 7.6 Marginalinhalte in der Marginalspalte und Kapitel Auswahl der Seitenaufteilung

Panel
panelIconId270f
panelIcon:pencil2:
panelIconText✏️
bgColor#FFEBE6

3. Verwendung im SmartEdit

3.1 Erstellen des Seiteninhalts “YouTube-Video”

Schrittweise Erläuterung für die Erstellung eines neuen Seitenschnipsel Seiteninhalts basierend auf der CMS-Vorlage “contentclass-snippet.gif YouTube-Video/Stream”.

Aktion

Vorschau im CMS

1
image-20240624-091025.pngImage Removed

Seite öffnen

seite_oeffnen_green.pngImage Added
2

icon_reddot_multilink.pngImage Removed

Pattern im Inhaltsbereich hinzufügen, sortieren, entfernen
icon_reddot_multilink.pngImage Added

Seiteninhalte

Seiteninhalte_allgemein.pngImage Added
3
AMnu_ConnectNewPage.gifImage Removed
AMnu_ConnectNewPage.gifImage Added

Seite erstellen & verknüpfen

image-20240627-122604.pngImage Removed
seite_erstellen_green.pngImage Added
4
folderopen.gifImage Removed
folderopen.gifImage Added

Content-Klassen Ordner “

Social-Media

Inhalts- und Marginalspalten - Templates” auswählen

Hinweis

Das Bildschirmfoto bildet eine allgemeine Darstellung aller Content-Klassen Ordner ab. Kann ggf. abweichen.

Content_Klassen-Ordner.pngImage Added
5
contentclass-snippet.gifImage Removed
contentclass-snippet.gifImage Added

Content-Klasse “YouTube-Video/Stream” auswählen

Hinweis

Das Bildschirmfoto bildet eine allgemeine Darstellung von Content-Klassen ab. Kann ggf. abweichen.

Content_Klassen.pngImage Added
6

Es erscheint ein Dialogfenster mit einem aus

dem Template

der Content-Klasse generierten Seitennamen, der mit der späteren Überschrift der neuen Seite belegt werden sollte.
Diese Überschrift wird nicht auf der erstellten Seite angezeigt. Sie dient als CMS-interne Überschrift

bzw. stellt den Seitennamen dar.

.

überschrift_seite_green.pngImage Added
7

ok.pngImage Removed

Mit “OK” bestätigen

ok_green.pngImage Added
8

Darstellung nach Erstellung “YouTube Video”.

Detail_menu_Ansicht.pngImage Added

3.2 Bearbeiten des Seiteninhalts “YouTube VideoStream”

Detail_menu.pngImage RemovedDetail_menu_Ansicht.pngImage Added

Bezeichnung

Beschreibung

icon_reddot_openpage (1).png YouTube Video VideoStream öffnen

öffnen der Seite (Inhaltselement) “YouTube Video”Seiteninhalt zur Bearbeitung öffnen

icon_reddot_closepage (1).png YouTube Video Schließen

schließt die Seite (Inhaltselement) “YouTube Video”

Ist das Bearbeitungsfenster geschlossen, kann über den Punkt … die Seite (Inhaltselement) “YouTube Video” zur Bearbeitung wieder geöffnet werden.VideoStream schließen

Bearbeitung beenden

icon_reddot.png Seite für andere Projekte freigebensiehe Anleitungsvideo unter (Icon)

Siehe dazu Kapitel 7.9 Projektfremde Seite einbinden

icon_reddot.png Überschrift bearbeiten

Einfügen einer Überschrift (analog zu BÜT) - dies ist optional.

icon_reddot.pngalternatives Vorschaubild verwenden

Beim Aufrufen einer Seite werden Videos zwar angezeigt, starten aber nicht von selbst. Für das Abspielen von integrierten Youtube-Videos muss der Nutzer vorher den Datenschutzhinweis akzeptieren. Dazu wird vorab ein gestaltetes Vorschaubild für jedes Video angezeigt (Standardeinstellung im CMS).
Bei Bedarf kann das Vorschaubild auch ersetzt werden. Dabei ist das YouTube Logo sowie der Play-Button im Vorschaubild zu platzieren. Die entsprechenden Icons können hier heruntergeladen werden → YouTube-Logo und Play-Button zum Download.

Hinweis.png Wie bearbeite ich Alt-texte, Bild-Titel und Bild-Rechte?

siehe Anleitungsvideo unter (Icon) Siehe dazu Kapitel Bild und Asset-Attribute

icon_reddot_obligatory.png YouTube Video auswählen

Auswahl eines YouTube Videos

Videos werden in der Regel im zentralen YouTube-Kanal des Freistaates Sachsen hochgeladen und von dort aus auf den Webseiten des Freistaates Sachsen eingebettet.

Nach klick auf den roten Punkt öffnet sich folgendes Fenster:

image-20240624-101739.pngImage Removed

  • Video auswählen

    • Speichern

    Es gibt verschieden Möglichkeiten ein Video auszuwählen. Die einzelnen Schritte sind im Abschnitt3.2.1 Videoauswahl erklärt.

    icon_reddot.png Video-Titel

    Details dazu erfragen (Stefan)

    icon_reddot.pngImage Removed Transkript

    Details dazu erfragen (Stefan)

    icon_reddot_multilink.pngImage Removed Verweis anlegen (z.B. auf alternatives Video mit Audiodeskription)

    Status
    colourBlue
    titleBARRIEREFRREIHEIT

    screenreader: Titel (Überschrift) Video

    icon_reddot.pngImage Added Video-Inhalt

    Status
    colourBlue
    titleBARRIEREFRREIHEIT

    Inhalt des Videos in Textform

    icon_reddot_multilink.pngImage Added Link

    Status
    colourBlue
    titleBARRIEREFRREIHEIT

    Die Audiodeskription kann als Download angeboten werden oder aber mit einem Alternativideo ebenfalls auch YouTube eingestellt werden, hierfür . Hierfür bietet sich die Option »nicht gelistet« an, mit der Videos nur via direktem URL-Aufruf angezeigt werden. Die Fassung in Deutscher Gebärdensprache sollte im eigentlichen Video in einer Box integriert werden.

    3.2.1 Videoauswahl

    image-20240624-101739.pngImage Removed

    Symbol

    Aktion

    1icon_reddot_obligatory.pngImage Added

    YouTube Video

    		Detail_menu.pngImage Added

    2icon_video.pngImage Added

    Auswahl über Video

    • Video aus der angezeigten Auswahl wählen (im Beispiel wurde “Bürgerbeteiligung in Sachsen: …” gewählt)

    • Mit “Speichern” bestätigen

    		videoauswahl_standard.pngImage Added
    3icon_playlist.pngImage Added

    Auswahl über Playlist

    • gewünschte Playlist auswählen

    • entsprechendes Video auswählen

    • Mit “Speichern” bestätigen

    		videoauswahl_playlist.pngImage Added
    4icon_search.pngImage Added

    Auswahl über Suchfenster

    • Suchbegriff im Suchfeld eingeben (im Beispiel: “Bürgerbeteiligung”)

    • entsprechendes Video auswählen

    • Mit “Speichern” bestätigen

    		videoauswahl_suche.pngImage Added
    5icon_id.pngImage Added

    Auswahl über ID

    Soll ein Video eingebunden werden, welches im YouTube-Kanal des Freistaates Sachsen nicht angeboten wird, dann kann dies über die ID des Videos eingebunden werden.

    • Video bei YouTube aufrufen

    • ID in der URL kopieren (in der Adresszeile des Browsers
      z. Bsp. https://www.youtube.com/watch?v=TRBi78r54A8)

    • einfügen der ID im Feld Video-ID (siehe Abbildung)

    • Mit “Speichern” bestätigen

    Info

    Die Abbildung zeigt einen zusätzlichen Ausschnitt von der YouTube Seite und dient nur zur Darstellung.

    		videoauswahl_2.pngImage Added
    6

    Darstellung nach der Auswahl im SmartEdit

    		Ansicht_SmartEdit_Videoauswahl.pngImage Added

    Panel
    panelIconId1f50d
    panelIcon:mag:
    panelIconText🔍
    bgColor#E3FCEF

    4. Häufig gestellte Fragen (FAQ)

    Frage

    Antwort

    Welcher YouTube Kanal ist bei der Videoauswahl hinterlegt?

    Der YouTube Kanal des “FreistaatSachsen” https://www.youtube.com/FreistaatSachsen

    Kann im CMS ein anderer YouTube Kanal eingestellt werden?

    Nein, aktuell ist der Kanal in einer zentralen Einstellung vorgegeben.

    Kann ein YouTube Video aus einem anderen YouTube Kanal laden?

    Ja, siehe Abschnitt “Auswahl über ID”. (Verlinkung einfügen) Videoauswahl - Auswahl über ID

    Wie kann ein Video der Videoauswahl hinzugefügt werden?

    Die Onlineredaktion ist für die Verwaltung des YouTube Kanal des “FreistaatSachsen” https://www.youtube.com/FreistaatSachsen zuständig.

    Ist es möglich Videos aus anderen Quellen als YouTube zu laden?

    Die Funktion ist aktuell nicht vorgesehen.

    Bei Anregungen zum Styleguide können Sie sich gern an die Onlineredaktion - onlineredaktion@sk.sachsen.de wenden.

    Ich sehe meine eingestelltes YouTube Video nicht bzw. kann es nicht abspielen

    Für das Abspielen von integrierten YouTube-Videos muss man vorher die Datenschutzhinweise akzeptieren.