Wie nutzt man das Styla CMS Modul "Video"?

Das Video-Modul bettet Videos auf Ihrer Website ein. Sie können Links von YouTube und Vimeo verwenden.

Video

Das Video-Modul bettet Videos auf Ihrer Website ein. Sie können Links von YouTube und Vimeo verwenden.

Vimeo hat mehr Einstellungsmöglichkeiten (zu aktivierende Parameter) als YouTube

33d0a5cc-e5c3-4159-8653-ff5d65359058

85d919a5-734a-4f4c-8e31-d17fee9db8d6

 

Text auf Video

Text auf Video ist eine Verschmelzung des Video- und des Bannermoduls. Es wird oft als Held verwendet oder um neue Innovationen zu zeigen oder vielleicht um dem Endbenutzer zu helfen, den Text zu verstehen.

Wenn Autoplay aktiviert ist, wird das Video in einer Schleife abgespielt und stummgeschaltet. Sie können die Stummschaltung aber auch aufheben. 


Autoplay funktioniert nur, wenn das Video zunächst stummgeschaltet ist. 

Für Text auf Video können Sie nur eine selbst gehostete MP4-URL verwenden. 
YouTube und Vimeo sind (im Moment) keine Option.

 

Beispiel Versionen:

 

Version

Video (Vimeo)

Video (YouTube)

Text on Video

Anwendungsbereich

Ein Video von Vimeo auf Ihrer Website einbetten

Ein Video von YouTube auf Ihrer Website einbetten

Ein Video mit Text einbetten - oft als Hero verwendet

Layout

 


  • Zeile: 1:1 Layout / geringere Breite
  • Ausrichten: Mitte / Oben Abstand: Groß /
    Innere Abstände: Groß
  • Kein Hintergrund

 

  • Zeile: Einspaltiges Layout / Voller Beschnitt
  • Abstand oben: Groß
  • Kein Hintergrund

Settings

  • Aktive Parameter: Video-Steuerelemente anzeigen, Titel anzeigen, Textzeile anzeigen

  • Thumbnail-Vorschaumodus (Lazy Load): ein - zur Verbesserung der Seitenleistung
  • Aktive Parameter: Autoplay, Stumm
  • Thumbnail-Vorschaumodus (Lazy Load): ein - zur Verbesserung der Seitenleistung

 

  • Voreinstellung: Dunkel überlagert
  • Textposition: unten rechts
  • Textfeldbreite: 30%
  • Textausrichtung: rechts
  • Aktive Parameter: Stummschalttaste und Autoplay-Video anzeigen
  • Ausrichtung der CTA-Gruppe: Zeile, Ausrichtung: rechts
  • Erweitert: Inner Text Padding: 8px

Preview

c355b92f-15b3-418b-b962-f2aa78b0d668

 

b25450ea-d2b8-4cce-a015-e1b6857c72ef