AnleitungVideo Box

Video Box: Videos zu Artikeln anzeigen

So zeigst du zu jedem Artikel ein Video oder eine YouTube-Playlist an – gesteuert über ein Funktionsattribut in JTL-Wawi.

  • 2 Min. Lesezeit

Mit der Video Box zeigst du zu jedem Artikel ein Video oder eine Playlist an – auf der Artikeldetailseite und in der Artikelübersicht. Welches Video angezeigt wird, legst du über ein Funktionsattribut in JTL-Wawi fest.

Voraussetzungen

  • Das Plugin ist installiert. Wie das geht, erfährst du im Artikel Plugin installieren.
  • Zugriff auf JTL-Wawi, um Funktionsattribute anzulegen und Artikeln zuzuweisen

1. Funktionsattribut anlegen

  1. Lege in JTL-Wawi ein neues Funktionsattribut mit dem Namen video an und wähle als Datentyp Text.
  2. Aktiviere das Attribut für deinen Onlineshop und speichere.

Wie du ein Funktionsattribut anlegst, zeigen wir dir Schritt für Schritt im Artikel Anzahl der Artikel pro Zeile einstellen – nur mit „Artikel“ statt „Kategorie“ als Bereich.

Hinweis: video ist der Standardname. Du kannst ihn jederzeit in den Plugin-Einstellungen ändern.

2. Video einem Artikel zuweisen

  1. Öffne auf YouTube das gewünschte Video und klicke unter dem Video auf „Teilen“.
  2. Klicke auf „Kopieren“.
  3. Öffne den Artikel in JTL-Wawi und füge das Funktionsattribut video hinzu.
  4. Trage als Wert den kopierten Link ein und speichere.

Unterstützt werden Videos von YouTube, Vimeo und lokale Videos.

Playlist anzeigen

Trage mehrere Video-Links ein, getrennt durch Kommas. Playlists funktionieren nur mit YouTube.

Aussehen anpassen

Die Darstellung übernimmt die Einstellungen deines Templates. Button und Fenster kannst du mit eigenem CSS gestalten, zum Beispiel über den JTL Theme Editor. Diese Selektoren stehen dir zur Verfügung:

Element

CSS-Selektor

Button allgemein

.themeart-video[data-toggle="modal"]

Button nur auf der Detailseite

.product-detail .themeart-video[data-toggle="modal"]

Button nur in der Übersicht

.productbox-inner .themeart-video[data-toggle="modal"]

Video-Fenster

.themeart-video.modal

Weiterführende Artikel

War dieser Artikel hilfreich?